Opera 忽略 .live() 事件处理程序
我有以下 jQuery，它适用于所有主要浏览器除了 Opera：
jQuery(document).ready(function () {
jQuery("#GetResults").live("click", function(e){
e.preventDefault(); //Opera doesn't execute anything here
});
};
单击以下链接时应该触发：
<a id="GetResults" href="Folder/File/javascript:void(0);">Get Results</a>
只有 Opera 会忽略这一点。有什么想法吗？
编辑：
我刚刚发现，如果我用 .live() 替换 .bind() ，一切都会按预期运行。我在 Opera 中找不到任何与 .live() 错误相关的文档，但它在 jsFiddle 中确实有效，这会指向一些环境问题。什么可能导致这种行为？
I have the following jQuery which works in all major browsers except Opera:
jQuery(document).ready(function () {
jQuery("#GetResults").live("click", function(e){
e.preventDefault(); //Opera doesn't execute anything here
});
};
Which is supposed to fire when clicking the following link:
<a id="GetResults" href="Folder/File/javascript:void(0);">Get Results</a>
Only Opera ignores this. Any ideas?
Edit:
I've just discovered that if I substitute out .live() for .bind() everything functions as expected. I can't find any documentation relating to .live() bugs in Opera though, and it does work in jsFiddle which would point at something environmental. What could be causing this behavour?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（7）
这需要澄清。上面的答案是正确的，但没有人清楚地解释你的问题来自哪里。
事实上，我认为您也可以在其他浏览器中重现该问题。
这是因为
.live的工作原理：它绑定到
document上的事件并等待特定事件冒泡到那里。然后它检查event.target是否是您想要处理的内容。*如果您单击链接元素，浏览器很可能会在事件冒泡足够高以触发您的代码之前转到新页面。在具有大量 HTML 和事件处理程序的应用程序中，所有浏览器都应该有问题。在这种情况下，Opera 只是开始显示新页面并更快地销毁前一个页面。它实际上更多地取决于特定情况而不是浏览器。例如：如果您在连接到站点时网络延迟较高，您可能不会看到这种情况发生。
为了防止对
a元素执行默认操作，您必须像以前那样使用.bind;) 当开发人员必须了解他使用 AJAX 加载的内容并绑定时回调中的新事件。*还有更多内容，.live更复杂。我刚刚描述了这里需要什么。This needs clarification. The answers above are correct, but nobody clearly explained where your problem comes from.
In fact I think that you could probably reproduce the problem in other browsers too.
That's because of how
.liveworks:It binds to the event on
documentand waits for a particular event to bubble up to there. Then it checks if theevent.targetis what you wanted to handle.*If you click on a link element it's quite possible that the browser goes to the new page before the event bubbles high enough to trigger your code. In an app with lots of HTML and event handlers all the browsers should have problems. Opera just starts displaying the new page and destroys the previous quicker in this case. It really depends on a particular situation more than on the browser. For example: you probably won't see this happen if you had a high network latency while connecting to the site.
To prevent default action on a
aelement you have to use.bindlike in the old days ;) when a eveloper had to be aware of what he loads with AJAX and bind new events to that in a callback.*There is more to that and.liveis more complicated. I just described what is needed here.使用附加处理程序时会发生什么：
您还可以尝试使用 .click() 方法附加处理程序。
What happens when you attach the handler using:
You can also try to attach the handler using .click() method.
以下代码在 Opera 11.50 中按预期工作。
它要么是一个已修正的错误，要么是更微妙的东西。
您能检查一下上述内容是否适用于您的 Opera / jQuery 版本吗？
The following code works as expected in Opera 11.50.
Either it is a corrected bug, or something more subtle.
Can you check whether the above works on your version of Opera / jQuery?
阅读这篇文章。尝试使用委托代替
Read this article. Try use delegate instead
不确定您是否想这样做，或者它是否适合您。我在 Opera 9.5 中遇到了类似的问题，并且
e.preventDefault()无法正常工作，我找到的唯一解决方案就是返回 false...Not sure if you want to do it, or if it will work for you. I had similar issues with Opera 9.5 and
e.preventDefault()not working, the only solution I found was to justreturn false...在这种情况下，事件冒泡有两个方面值得考虑：传播和默认操作。
传播是指事件冒泡。首先，锚标记获取单击事件，然后是其父元素，然后是其父元素的父元素，依此类推，直到文档元素。您可以随时通过调用
e.stopPropagation()来停止事件的传播。默认操作是如果不采取措施阻止浏览器将执行的操作。最常见的情况是，当单击带有
href的锚点时，浏览器将尝试导航到那里。不过，还有其他示例，例如，当您单击并拖动图像时，许多浏览器会创建一个重影图像，您可以将其拖放到另一个应用程序上。在这两种情况下，您都可以通过调用e.preventDefault()随时阻止浏览器执行默认操作，正如该问题的其他答案中提到的，jQuery 的
.live() 功能在高级元素（如document）处设置处理程序，并在事件向上传播后采取操作。如果锚点和文档之间的处理程序调用e.stopPropagaiton()而不调用e.preventDefault()，它将停止实时处理程序停止响应，同时仍允许浏览器导航（默认操作）。我怀疑这就是正在发生的事情，因为它会影响所有浏览器，但这是一种可能的解释。
There are two aspects of an event bubbling worth considering in this case: propagation and the default action.
Propagation refers to the event bubbling. First the anchor tag gets the click event, then its parent element, then its parent's parent, and so forth, up to the document element. You can stop an event from propagating at any time by calling
e.stopPropagation().The default action is what the browser will do if nothing is done to prevent it. The most well-known case is when an anchor with an
hrefis clicked, the browser will try to navigate there. There are other examples too, though, for example when you click and drag an image, many browsers will create a ghost image you can drop on another application. In both cases, you can stop the browser from doing the default action at any time by callinge.preventDefault()As mentioned in other answers to this question, jQuery's
.live()feature sets a handler at a high level element (likedocument) and takes action after events have propagated up. If a handler in between the anchor and the document callse.stopPropagaiton()without callinge.preventDefault()it would stop the live handler from responding, while still allowing the browser to navigate (the default action).I doubt this is what's happening, since it would affect all browsers, but it's one possible explanation.
确保在单击链接之前发生 document.ready 事件。
尝试将所有生命放在 document.ready 包装器的顶部。如果您有大量 javascript 代码，这可能会有所帮助。
Ensure that document.ready event happens before you click on link.
Try to put all lives in the top of the document.ready wrapper. It may help, if you have a lot of javascript code.