javascript - .click 不适用于图形中的 anchor

Question

我有一个由 JavaScript 代码加载的图形，该图形包含一个图像描述和两个按钮，有时该描述有一个带有名为 fig 的属性的 anchor ，请参见下文。

<a fig="allow" href="#tt5">[1]</a>

现在如果 anchor 不在图形中并且属性 fig 是允许的，JS 将通过添加类属性 = pop-up 创建一个图形，并且该图形将显示在链接下方，因此 anchor 将如下所示:

<a class="pop-up" fig="allow" href="tt5">[o]</a>

但在我的例子中， anchor 在图形内部，所以我只需要关闭图形，但 .click 和 .live 似乎不起作用。

这是我尝试过的:

1. 使用 .live() :

   $viewer.find('div > div > span.Figcontent > a').live('click',function() {
        toggleViewerCaption();
   });
   

2. 使用.click

   $viewer.find('div > div > span.Figcontent > a').click(function(){
       toggleViewerCaption();
   });
   

注意:

1. 我已通过在控制台中对其进行测试并返回 tt5 来确保上述内容正在访问正确的 anchor 。

2. 即使控制台返回了正确的值，调试器也不会在上面的语法中遇到断点。

Answer 1

I've a figure that is loaded by a JavaScript code...

你应该使用事件委托(delegate) on() 因为您处理的是动态生成的 DOM:

$viewer.on("click", "div > div > span.Figcontent > a", function(){
    toggleViewerCaption(); 
});

注意:

As of jQuery 1.7, the .live() method is deprecated. Use .on() to attach event handlers.

希望这对您有所帮助。