0

我正在通过 ajax 调用动态生成一个表格,我希望特定列中的所有元素在悬停时显示一个弹出框。我在成功事件中有以下代码:

strBtn1 = '<span data-trigger="hover" data-placement="right" data-content="testing popovers in a table" class="test22">test</span>'
$('#myReport').append('<tr><td>Column 1</td><td>' + strBtn1 + '</td></tr>');

然后我在我的主脚本中尝试了这个:

$(".test22").each(function () {
    $(this).popover();
});

该表按我的预期生成,有 15 行,但将鼠标悬停在“测试”文本上没有任何作用。

我也有一种“控制”确实有效:

<span id="test11" data-trigger="hover" data-placement="right" data-content="testing popovers in a table">test</span>

这直接在标头的 HTML 文件中,并且在主脚本中:

$("#test11").popover();

所以在标题中我得到一个“测试”,当我悬停时会显示一个弹出窗口。

想法?

4

2 回答 2

1

您需要确保 $(".test22").each(function () { $(this).popover(); });填充表后才运行,否则它将无法找到任何类。

要测试它是否正常工作,请尝试在每个函数中放置一个控制台日志,以查看该函数实际执行了多少次。

如果您没有返回任何控制台日志,那么这意味着您必须尝试运行 each,然后才能进行任何迭代。

如果确实如此,那么我建议将每个 jQuery 放入一个函数中,然后在 ajax 成功中调用该函数。

于 2013-04-17T18:07:22.193 回答
0

成功解决了这个问题。

counter += 1;
tmpID = 'thisCell' + counter;
strBtn1 = '<span id="' + tmpID + '" data-trigger="hover" data-placement="right" data-content="testing popovers in a table" class="test22">test</span>'
$('#myReport').append('<tr><td>Column 1</td><td>' + strBtn1 + '</td></tr>');
$('#' + tmpID).popover();

然后我完全删除了“每个”语句。

于 2013-04-17T18:10:09.627 回答