javascript jquery 点击事件未在 Internet Explorer 上触发

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/23397678/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 00:49:19  来源:igfitidea点击:

jquery click event not fired on internet explorer

javascriptjquerycsshtml

提问by Nicholas

I am trying to do something when user clicks on label.

当用户点击标签时,我正在尝试做一些事情。

<label class="my-label"> ....

I am trying to get the click event fired It is working on chrome and safari but not working on IE 11.

我正在尝试触发点击事件它在 chrome 和 safari 上工作,但在 IE 11 上不起作用。

$(".my-label").click(function(){
});

I tried on, bind, live, but no success.

我试过,绑定,活,但没有成功。

Please help me with this. Spent 2 days for this, going crazy here.

请帮我解决一下这个。为此花了 2 天,在这里发疯。

Thanks.

谢谢。

回答by Saturnix

replace

代替

$(".my-label").click

with

$(".my-label").click();

You're not calling the method with click. You're just referencing it. I wonder why it works in Safari/Chrome: it shouldn't.

你不是用click. 你只是引用它。我想知道为什么它在 Safari/Chrome 中有效:它不应该。



Edit: user edited the question, providing more context.

编辑:用户编辑了问题,提供了更多上下文。

Most likely, the reason why it is not working now is because you're missing a document ready. Replace your code with:

最有可能的是,它现在不起作用的原因是因为您缺少准备好的文档。将您的代码替换为:

$(document).ready(function(){ 

    console.log("document ready!");
    $(".my-label").click(function(){
        console.log("click function!");
    });

});

Please report back with what you see in your JavaScript console.

请报告您在 JavaScript 控制台中看到的内容。

If now it is working, the reason why Safari/Chrome were already ok is because, in those browser, the code was executed after the DOM rendering. That was just luck. Never you should rely on the DOM being ready: always put all of the code referencing any DOM node inside of a $(document).ready()call.

如果现在它可以工作了,那么 Safari/Chrome 之所以可以正常工作,是因为在那些浏览器中,代码是在 DOM 渲染之后执行的。那只是运气。永远不要依赖已准备好的 DOM:始终将所有引用任何 DOM 节点的代码放在$(document).ready()调用中。

If this is still not working in IE11, then you should provide more context to your question. For example, what does console.log($(".my-label").length)returns? If it is 0, then IE11 is not finding the node. Again, the only reason why this should happen is because the DOM is not ready or, perhaps, the code itself doesn't get called. If you have any error before $(".my-label").click()that code won't get executed. Please note that many "errors" that are accepted in normal browser are not in IE. If you don't post what you see in IE11 JavaScript console, I assume it is clear (and thus there are no errors) but I don't know if you even checked that so I'm taking this as a possibility.

如果这在 IE11 中仍然不起作用,那么您应该为您的问题提供更多背景信息。例如,console.log($(".my-label").length)返回什么?如果是0,则 IE11 未找到该节点。同样,发生这种情况的唯一原因是 DOM 还没有准备好,或者代码本身没有被调用。如果您在$(".my-label").click()该代码不会被执行之前有任何错误。请注意,在普通浏览器中接受的许多“错误”不在 IE 中。如果您没有发布您在 IE11 JavaScript 控制台中看到的内容,我认为它很清楚(因此没有错误)但我不知道您是否检查过,所以我认为这是一种可能性。

回答by muglio

Are you setting up your click handler inside of a dom ready callback? If not your javascript statement is probably being executed prior to the label existing in DOM.

您是否在 dom 就绪回调中设置了点击处理程序?如果不是,您的 javascript 语句可能在 DOM 中存在的标签之前执行。

Here is a fiddle: http://jsfiddle.net/muglio/mTaVR/

这是一个小提琴:http: //jsfiddle.net/muglio/mTaVR/

$(document).ready(function() {
    $('.my-label').on('click',function(evt) {
       alert('clicked');
    });
});

回答by ceanf

this is what i had to do to get things working properly. best i can guess, the call to focus() also causes it to lose focus which is what fires the change event for IE.

这是我必须做的事情才能正常工作。我能猜到,对 focus() 的调用也会导致它失去焦点,这就是触发 IE 更改事件的原因。

also, a note on the suggested .click() method... while this will allow an event to fire, so that code can be ran, it does not cause the to lose focus, so the selected index & value are never changed (at least in my case). i event went so far as to call .trigger('change') from the click event in an attempt to force the change, and while the event would fire, the selected option never changed.

此外,关于建议的 .click() 方法的说明......虽然这将允许触发事件,以便可以运行代码,但它不会导致失去焦点,因此所选的索引和值永远不会改变(至少在我的情况下)。i 事件甚至从点击事件中调用 .trigger('change') 以试图强制更改,虽然该事件会触发,但所选选项从未改变。

i know it is a hack, but it works pretty damn well IMO

我知道这是一个 hack,但它在 IMO 中运行得非常好

// IE hack to get change event to fire properly
if ($.browser.msie) {
    $('select').on('mouseover', function (e) {
        $(e.target).focus();
    });
}