jQuery单击事件不会触发

Question

我正在使用jwplayer最新版本6.8。 当用户在播放器中点击我的徽标时，我尝试使用jQuery来调用函数，但它不起作用。

这是HTML中播放器的徽标图像标记：

<img class="jwlogo" id="container_logo" src="..." />

这是jQuery函数：

<script type="text/javascript">
  $(document).ready(function(){            
    $("#container_logo").click(function() { 
      alert('Work!');
    });               
  });                  
</script>

这是测试页面： http ： //vt-test.co.nf

有什么帮助吗？

Answer 1

既然您正在使用jQuery 1.3，请尝试使用jQuery.live如下所示：

$('#container_logo').live('click', function() {
    alert('Work!');
});

注意：

从jQuery 1.7开始，不推荐使用.live（）方法。

编辑

我找到了一个使用JWPlayer的onReady事件的解决方案：

$(function() {            
    jwplayer("container").onReady(function() {
        $('#container_logo').click(function() {
            alert('Works!');
        });
    });
});

你可以在this jsfiddle看到它的this jsfiddle但是，我建议你更新你的jQuery版本并使用jQuery.on

Answer 2

首先，我建议您更新您的jQuery版本或使用jQuery noConflict 。

然后，您需要使用包装div包围图像并使用.on()委派click事件。

HTML：

<div id="myWrapper">
    <img class="jwlogo" id="container_logo" src="..." />
</div>

jQuery的：

$(document).ready(function() {
    $("#myWrapper").on("click", "#container_logo", function() {
        alert("Work!");
    });
});

Answer 3

实际上，右上角链接对我有用。

但是，尝试：

$(document).on('click', '#container_logo', function(){  
    alert("hello"); 
});  

如果元素被注入，那就可以了。

由于您使用的是旧版本的jQuery（1.3.1），因此必须使用.live() ，如下所示：

$(document).live('click', '#container_logo', function(){  
    alert("hello"); 
});  

另请注意，您可以将包装器绑定到注入代码的DOM元素：

$('#container').on('click', '#container_logo', function(){  
    alert("hello"); 
});