1

我正在这样做： 

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

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

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

第二个代码一直工作，但第一个代码只工作一次。

此外，如果第二个代码运行一次，则第一个代码甚至不会运行一次。

解决办法是什么？我想我在这里遗漏了一些规则，你能告诉他们，以便我搜索它们。谢谢

4

2 回答 2

0

事件绑定器应始终可用；如果不是，那是因为您正在更改 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() { ... }
于 2012-05-21T17:28:25.747 回答
0

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

$(document).on("keypress", "#id", function(){
alert("event happened");
})
于 2016-01-23T13:06:37.543 回答