0

我正在使用线索提示插件在链接上显示工具提示。在工具提示中有文本和链接 - 如果单击链接（带有“显示面板”类），则灯箱类型的 div 应该在顶部打开。但是，click 事件似乎没有绑定到工具提示中的链接——它利用了 JQuery UI 小部件。我知道灯箱脚本有效，因为它适用于工具提示框外的链接。这是 JQuery UI 完成后的 HTML。

<div id="cluetip" class="cluetip ui-widget ui-widget-content ui-cluetip clue-top-sequoia cluetip-sequoia" style="position: absolute; width: 275px; left: 126.5px; z-index: 97; top: 124px; box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.5); display: block;">
<div class="cluetip-outer" style="position: relative; z-index: 97; overflow: visible; height: auto;">
<h3 class="cluetip-title ui-widget-header ui-cluetip-header">Sed ut perspiciatis unde omnis</h3>
<div class="cluetip-inner ui-widget-content ui-cluetip-content">
<div class="cluetip-close">
iste natus error
<a class="show-panel" rel="detailpage" href="http://www.my.link/">sit voluptatem</a>
accusantium doloremque laudantium, sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.
</div>
</div>
<div class="cluetip-extra"></div>
<div class="cluetip-arrows ui-state-default" style="z-index: 98; display: block;"></div>
</div>

这是JQuery：

$("a.show-panel").click(function(e){
//alert("works");
$("#lightbox, #lightbox-panel").fadeIn(300);
e.preventDefault();
})  
$("a#close-panel").click(function(e){  
$("#lightbox, #lightbox-panel").fadeOut(300);
e.preventDefault();
})

我猜这是某种范围问题，但我不知道如何访问该链接。

任何建议都将非常受欢迎！

4

3 回答 3

1

感谢@FoRever_Zambia 在他的评论中的回答，尽管从 JQuery 1.7 开始，'delegate' 方法已被 'on' 方法取代。

有效的代码如下。

$(".cluetip-inner").on("click", ".show-panel", function(e) {
$("#lightbox, #lightbox-panel").fadeIn(300);
e.preventDefault();  
});
于 2011-11-29T12:18:56.027 回答
0 
http://api.jquery.com/bind/

$("a#close-panel").bind("click", function(){

});

编辑：抱歉之前没有留下解释。您不能将绑定应用于页面加载时未出现在 dom 中的内容。如果您在页面中加载或创建元素，例如工具提示框，则需要使用 jQuery 绑定方法。

于 2011-11-28T14:02:04.983 回答
0

上面shadylane的答案很好。有时，我认为在这些场景中研究您使用 jQuery 定位的选择器同样重要。使用诸如线索提示之类的东西时，DOM 有很多附加内容，您必须记住，它可能是从插件生成的选择器，而不是任何实际“存在”的东西。哦，还有线索提示！

于 2013-05-20T17:36:31.483 回答