Question

这可能非常简单 - 但我很难发现正在发生的事情。

在JS小提琴上： http://jsfiddle.net/3hHAX/

有两个链接输出到“打开视频模式”。

正如链接文字所示，这两个链接应该打开包含youtube视频的模型弹出窗口。

这是使用来自：http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/

的prettyphoto库

由于某种原因，点击事件不会在第一次点击时触发。但是第二次工作。

（没有包含CSS所以看起来不是很模态，但你会看到下面的内容加载至少是为了演示的目的）。

有人可以说明出了什么问题吗？

谢谢，

史蒂夫

Answer 1

初始化后触发click事件，只允许初始化一次。

(function($) {    
    $(".watch-this a, .field-name-field-embed-code a").live('click',function(){
        if (!$(this).is(".pPhoto")) {
            $(this).prettyPhoto({
                social_tools: ''
            }).addClass("pPhoto").click();     
        }
        return false;    
    });
})(jQuery);

演示： http://jsfiddle.net/3hHAX/3/

编辑以澄清：
这是在动态元素上初始化插件的一种非常常见的方法。如上所述，如果元素不是动态的，最好在dom上初始化。

注意：
.live已弃用，您应该使用.on

(function($) { $(document).on("click",".watch-this a, .field-name-field-embed-code a",function(){ if (!$(this).is(".pPhoto")) { $(this).prettyPhoto({ social_tools: '' }).addClass("pPhoto").click(); } return false; }); })(jQuery);

Answer 2

谢谢大家，

这两个回复都帮我最终解决了。

更新的JSFiddle中的最终解决方案：

http://jsfiddle.net/3hHAX/6/

似乎prettyPhoto在点击事件上附加了它自己，只需要应用那些dom元素。

谢谢，史蒂夫

Answer 3

首先，永远不要在jquery中使用live方法，除非在dom真的不受你控制的情况下。至少你应该使用委托功能，因为实时功能会导致很多减速和很多麻烦（虽然这次没有出错）。
其次，click事件会触发，因为你可以看到here，但是由于我不知道的原因，prettyPhotos组件第一次没有工作，但是你可以在之前的jsfiddle链接中看到它< em>确实在第一次点击时使用警报，所以这听起来像是漂亮的照片脚本中的一个错误（Kevin B似乎通过触发第二次点击事件来解决这个错误。）。

Jquery点击事件 - 需要两次点击才能触发

3 个答案: