Question

我这样做：

$(".classname").bind("keypress",function(){
    alert("event happened");
})

代码与上面类似，只工作一次，我的意思是，第一次你输入并点击进入，它的工作，但下一次，它根本没有反应。

$("#id").bind("keypress",function(){
   alert("haiii");
})

第二个代码一直在工作，但第一个代码只能工作一次。此外，如果第二个代码运行一次，第一个代码甚至不运行一次。解决办法是什么？我想我在这里错过了一些规则，你能告诉他们我会搜索他们感谢

Answer 1

活动活页夹应始终可用;如果它不是因为您正在更改HTML结构（添加或删除节点）。在您的情况下，您在运行时动态更改HTML，您需要使用.on()

尝试使用此代替.bind()：

    $('#id').on({
       keypress: function () { alert("hi"); }
    });

    $('.ClassName').on({
       keypress: function () { alert("hi"); }
    });

    // IF YOU KNOW CLASSNAME ELEMENTS ARE INSIDE A FIXED ELEMENT:

    $('#FixedID').on({
       keypress: function () { alert("hi"); }
    }, '.ClassName');

关于编码风格，您应该将事件处理程序和处理事件的函数分开。例如，代替处理程序也执行代码的地方：

// one function that does everything!!
$(document).ready(function() {
    // bind events
    $('#SomeID').on({

       click: function () {
         // huge wall of code that handles events
       },
       mouseenter: function () {
         // another huuuuuuuge wall of code here
       }
    )};
});

你应该有这样的东西：

$(document).ready(function () {
    BindHandlers();
    DoSomethingElseWithPageInit();
}); 

function BindHandlers() {
// handlers do just the handling of events; easy to see and understand
   $('#SomeID').on({
      click: function (e) { ClickOnSomeID(e); },
      mouseenter: function () { MouseEnterOnSomeID(); }
   )};
}

// here are the functions that process the event
function ClickOnSomeID(e) { ... }
function MouseEnterOnSomeID() { ... }

Answer 2

正如frenchie所说，这是因为你的html结构发生了变化。这已被.live（）处理，但现在.on（）是继承者。但是你应该使用on（）而不是元素，而是使用文档：

$(document).on("keypress", "#id", function(){
alert("event happened");
})

Keypress事件只发射一次

2 个答案: