如何让jquery工具提示悬停在我所有的单选按钮

How to have jquery tooltip hover on all my radio buttons

本文关键字：单选按钮 悬停 jquery 工具提示      更新时间：2023-09-26

我有一个在顶部有一个按钮的表单。如果我点击那个按钮，它就会在底部显示四个单选按钮。现在我计划有jquery工具提示悬停在我所有的单选按钮。

这是我的护照。

  • 如果我将鼠标移动到TEST1单选按钮上，我想显示Hello Test1
  • 如果我在TEST2单选按钮上移动鼠标，我想显示Hello Test2
  • 如果我在TEST3单选按钮上移动鼠标，我想显示Hello Test3
  • 如果我在TEST4单选按钮上移动鼠标，我想显示Hello Test4

这是可能的吗?我看到了这个例子，但他们在div中有一个单选按钮，所以不确定这在我的情况下如何工作。

谁能提供jsfiddle的例子?

注意:-

Hello Test1只是一个例子，它可以是任何两个或三个行的单词或段落。当我将集成的代码，我将使用不同的词为我所有的单选按钮..

这里是附加的演示链接，请参阅:

http://jsfiddle.net/4Nmqk/32/

添加到你的js

$('label').tooltip({
    placement : 'top'
});

你的HTML是这样的

    <label  title='hello test1'><input type="radio" name="data" id="data" value="test1">TEST1 </label>
    <label title='hello test2'><input type="radio" name="data" id="data" value="test2">TEST2 </label>
    <label  title='hello test3'><input type="radio" name="data" id="data" value="test3">TEST3 </label>
    <label  title='hello test4'><input type="radio" name="data" id="data" value="test4">TEST4 </label>

你想要任何其他的名称，每个输入，你可以改变标签标签的标题作为你的选择。

你也使用id=data为所有四个输入这是无效的HTML你可以使用id的相同值只有一次的页面，所以给所有四个输入不同的id值，或者你可以使用类而不是id。

您可以迭代单选按钮并为其设置标题

$("input[type*=radio]").each(function(i,value){ 
    $(this).attr("title","Hello "+$(this).val());
    });
http://jsfiddle.net/4Nmqk/30/

相关文章：