Question

我有一个表单，其中顶部有一个按钮。如果我点击那个按钮，它会在底部显示四个单选按钮..现在我打算让jquery工具提示悬停在我的所有单选按钮上。

这是我的jsfiddle。

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

这可能吗？我看到了这个example，但他们在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值，或者你可以使用class而不是id。

Answer 2

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

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

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

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

2 个答案: