如何在（protip）工具提示内容上注册“点击”事件？

Question

我正在使用http://protip.rocks/作为工具提示，但我遇到了问题。

所以我有：

<span class="tooltip_templates">
            <span id="tooltip_content_{TAB_LOOP.ITEM_LOOP.ITEM_ID}">
            <!-- BEGIN ITEM_LOOP.CHILD_ITEM_LOOP -->
            <!-- IF TAB_LOOP.ITEM_LOOP.ITEM_ID == TAB_LOOP.ITEM_LOOP.CHILD_ITEM_LOOP.P_ID -->
            <a href ="#"><img class = 'hide' src ="{T_IMAGES_PATH}custom_avatars/item_thumbnails/{TAB_LOOP.ITEM_LOOP.CHILD_ITEM_LOOP.C_ID}.png" title ="{TAB_LOOP.ITEM_LOOP.ITEM_NAME}" id ="{TAB_LOOP.ITEM_LOOP.CHILD_ITEM_LOOP.C_ID}"/></a>
            <!-- ENDIF -->
            <!-- END ITEM_LOOP.CHILD_ITEM_LOOP -->
             <a href = "#"><img class = 'hide' src ="{T_IMAGES_PATH}custom_avatars/item_thumbnails/{TAB_LOOP.ITEM_LOOP.ITEM_ID}.png" title ="{TAB_LOOP.ITEM_LOOP.ITEM_NAME}" id ="{TAB_LOOP.ITEM_LOOP.ITEM_ID}" /></a>
            </span>
          </span>

和

 $( ".tooltip_templates img" ).click(function() {
      alert("ok"); 
  });`

事件不会在这里触发，所以我检查了页面的来源并看到了

因此看起来内容已移至protip-content，但是将click函数的类更改为.protip-content也不会触发该事件。有什么想法吗？

我尝试通过在所有图片点击中添加提醒来进行一些测试，因为您可以看到在点击工具提示内部的图片时未调用该事件。

Answer 1

你快到了。我认为你的DOM Elements [.tooltip_templates img]没有调用该事件的原因是因为在$（document）.ready（）之后没有在DOM中调用它。您需要使用[.on]或[.delegate]附加并触发这些事件：

参考文献：

[on] = http://api.jquery.com/on/

[delegate] = http://api.jquery.com/delegate/

$('.tooltip_templates img').on('click', function(event) {
    event.preventDefault();
    alert('here');
});

这是一个示例参考的jsfiddle： http://jsfiddle.net/qrgphhu6/