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

Question

我有一个表单，上面有一个按钮。 如果单击该按钮，那么它将在底部显示四个单选按钮。现在，我计划将jQuery工具提示悬停在所有单选按钮上。

这是我的jsfiddle 。

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

这可能吗？ 我看到了这个示例，但是它们以某种方式在div中具有单选按钮，因此不确定在我的情况下该如何工作。

谁能提供jsfiddle示例？

注意：-

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

Answer 1

这是附加的演示链接，请查看：

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。

Answer 2

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

$("input[type*=radio]").each(function(i,value){ 
    $(this).attr("title","Hello "+$(this).val());
    });

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