简体   繁体   English

为什么我的JQuery事件处理程序不删除代码工作

[英]Why doesn't my JQuery event handler remove code work

Absolute newbie here... 绝对是新手...

<html>
<head>
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
</head>
<body>
    <script type="text/javascript">
        function Foo() {
            d = new Date();
            alert("Hello" + d.getTime());
            alert($('#a1').attr('id'));
            $('#a1').unbind("click");
            $('#a1').off("click");
            $('#a1').unbind();
        }

        $(document).ready(function() {});
    </script>
    <input id='a1' type="button" value="foo" onclick="Foo();" />
</body>
</html>

However everytime I click on my foo button it nicely pops up all alerts... totally ignoring my unbind, off, unbind calls. 但是,每次我单击foo按钮时,它都会很好地弹出所有警报...完全忽略了我的未绑定,关闭,未绑定的呼叫。

What would it take to remove the event handler? 删除事件处理程序将需要什么?

My Objective is that when the event handler set by the HTML executes, in the event handler I unbind/unset/undo/off the event handler which has been set by HTML. 我的目标是执行由HTML设置的事件处理程序时,在事件处理程序中,我取消绑定/取消设置/撤消/关闭由HTML设置的事件处理程序。

Many solutions below kill the event handler totally. 下面的许多解决方案完全杀死了事件处理程序。 but I want to stop if after the first click. 但如果要第一次单击停止。

I cannot set the event via "one" method. 我无法通过“一个”方法设置事件。 the HTML already has the onclick event. HTML已经具有onclick事件。

jQuery's unbind() and off() apply only to event handlers assigned via jQuery, not to event handler assigned via the onclick attribute. jQuery的unbind()off()仅适用于通过jQuery分配的事件处理程序,不适用于通过onclick属性分配的事件处理程序。

If you want to clear that attribute, you can just do that: 如果要清除该属性,则可以执行以下操作:

$("#a1").removeAttr("onclick");

Put into place, it would look like this: 放到位,它看起来像这样:

<html>
<head>
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
</head>
<body>
    <script type="text/javascript">
        function Foo() {
            var d = new Date();
            alert("Hello" + d.getTime());
            alert($('#a1').attr('id'));
            // remove event handler
            $("#a1").removeAttr("onclick");
        }

        $(document).ready(function() {});
    </script>
    <input id='a1' type="button" value="foo" onclick="Foo();" />
</body>
</html>

Working demo here: http://jsfiddle.net/jfriend00/bQ9Lq/ 此处的演示工作: http : //jsfiddle.net/jfriend00/bQ9Lq/


If you want an event handler that is only active for one click, then you may want to install the original event handler with jQuery's .one() (instead of using onclick) which will automatically remove the event handler after it fires once and you won't even have to write code to remove it. 如果您希望事件处理程序仅在单击时处于活动状态,那么您可能希望使用jQuery的.one() (而不是使用onclick)安装原始事件处理程序,它将在触发一次后自动删除该事件处理程序,您将赢得甚至不必编写代码将其删除。

<html>
<head>
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
</head>
<body>
    <script type="text/javascript">
        $(document).ready(function() {
           $("#a1").one("click", function() {
               var d = new Date();
               alert("Hello" + d.getTime());
               alert($('#a1').attr('id'));
           });
        });
    </script>
    <input id='a1' type="button" value="foo" />
</body>
</html>

Because you are using inlined event handler, just remove the onclick attribute 因为您使用的是内联事件处理程序,所以只需删除onclick属性

function Foo() {
    d = new Date();
    alert("Hello" + d.getTime());
    alert($('#a1').attr('id'));
    $('#a1').removeAttr("onclick");
}

You did not bind with jQuery so do not unbind with jQuery rather unbind with javascript, you would need indexer or get() 您未与jQuery绑定,因此请勿与jQuery解除绑定,而与javascript解除绑定,则需要indexer或get()

Live Demo 现场演示

$('#a1')[0].onclick = null;

or 要么

$('#a1').get(0).onclick = null;;

You can unbind using attr() 您可以使用attr()解除绑定

Live Demo 现场演示

 $('#a1').attr("onclick", "");

try this 尝试这个

$(document).ready(function() {
    $( "#a1" ).bind( "click", function() {
        d = new Date();
        alert("Hello" + d.getTime());
        alert($('#a1').attr('id'));
        $('#a1').unbind("click");
    });
 });

<input id='a1' type="button" value="foo" />

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM