JQuery .click() 事件，IE 8&9 中非常奇怪的行为

Question

>我创建了一个视频库，它根据元素的数据属性通过swfobject加载Youtube视频。它在所有浏览器中都运行良好，除了IE。我看到的奇怪行为没有意义。

每个缩略图的标记如下所示：

<li>
    <div class="movie-image">
        <a class="" data-videotitle="Title" data-videoid="$node.contribution('video')" href="http://www.youtube.com/watch?v=41ZskpgQqZ4">
            <img class="video-link" data-videotitle="Title" data-videoid="41ZskpgQqZ4" src="http://img.youtube.com/vi/41ZskpgQqZ4/default.jpg" alt="Title">
            <h5>Title</h5>
        </a>
    </div>
</li>

使用此 javascript 绑定事件：

$('.video-link').click(function(){
    player.setVideo(this.getAttribute("data-videoid"), true);
    player.setTitle(this.getAttribute("data-videotitle"));
    window.event.returnValue = false; //IESUX
    if(window.event.stopPropagation) window.event.stopPropagation();
    window.event.cancelBubble = true;
    //Yes, there's a lot of redundancy here. None has worked.
    return false;
})

现在，这是奇怪的部分：当我在除IE以外的任何浏览器中单击链接时，该事件工作正常。

但是，在IE中，如果我单击h5元素，则一切正常。但是，如果我单击图像，浏览器将导航到缩略图。这真的很奇怪，因为这甚至不是链接的目标。

编辑：我忘了提到，我在这个特定的网页上使用JQuery 1.4.2。

编辑2：嗯...废话。我只是尝试将小提琴放在一起来显示问题，但是即使使用旧版本的JQuery，小提琴也可以正常工作。

Answer 1

jQuery包装事件对象，并为其提供方法，这些方法可以更好地执行您尝试执行的操作：

$(".video-link").click(function (e) {
   player.setVideo(this.getAttribute("data-videoid"), true);
   player.setTitle(this.getAttribute("data-videotitle"));
   e.stopPropagation();
   e.preventDefault();
});

请注意，return false被明确省略 - 您不需要它。

我的猜测是IE要么抛出某种错误，停止JS执行并最终遵循链接，要么默认操作未正确停止。