Question

我正在使用jQuery Tools（http://flowplayer.org/tools/index.html）来创建工具提示，我创建了一个包含以下行的js文件：

$("div#example-0").tooltip('#example-0-tooltip');
$("div#example-1").tooltip('#example-1-tooltip');
$("div#example-2").tooltip('#example-2-tooltip');
$("div#example-3").tooltip('#example-3-tooltip');

等

如果有已知数量的example-div，这样可以正常工作，但我希望这可以使用未知数量的example-div。

基本上我希望我的jQuery能够读取DOM树并确定有多少example-div，并以某种方式遍历它们并添加工具提示。

任何人都知道怎么做？

Answer 1

使用 starts with 属性匹配器并迭代。从当前元素中获取id并调用工具提示。

$('div[id^=example-]').each( function() {
    $(this).tooltip( '#' + $(this).attr('id') + '-tooltip' );
});

或者，如果除了唯一ID之外，它们各自具有相同的类别。

$('div.exampleClass').each( function() {
    $(this).tooltip( '#' + $(this).attr('id') + '-tooltip' );
});

或者，正如@Savageman建议的那样，你可以在工具提示中重复使用相同的命名DIV（并使用类来标记需要工具提示的所有div）。

$('div.exampleClass').tooltip('#exampleTooltip');

Answer 2

给他们所有相同的课程，以便你可以做到

$('div.classname').tooltip(...);

Answer 3

返回元素编号：

$('element').size();

Answer 4

将某个类放到所有div中。基本代码将保持不变。

例如：

<div id="1" class="tooltip">
</div>

<div id="2" class="tooltip">
</div>
<div id="3" class="tooltip">
</div>
<div id="4" class="tooltip">
</div>

和代码：

$("div.tooltip").tooltip('#example-0-tooltip');

Answer 5

不确定这是否有帮助，但是jquery有一个工具提示插件，它可以使用标签的title属性来生成工具提示。它会自动执行，因此您不必为每个语句设置语句，只需将标题分配给div。

使用jQuery确定div的数量

5 个答案: