jQuery 在 .live( "keyup" 上崩溃

Question

我在这里有一些代码：

$(document).ready(function() {
$("#querybox").live("keyup", function(e) {
    var code = (e.keyCode ? e.keyCode : e.which);
    if (code == 13) {
       $("#querybox").blur();
    }
    else {
        search(document.getElementById('querybox').value);
    }
    /*if (document.getElementById('querybox').value == "") {
        $("center").removeHighlight();  
    }*/
});
});

检测keyUp并使用它来搜索某个内容。问题是：当#querybox被退格到空的时候，整个页面都崩溃了，我从Google Chrome收到了"哇，Snap！"的消息。

我使用的是jQuery v1.7.2

一百万！

编辑

我还应该指出，search（）函数突出显示了正文中的文本（请注意注释部分）。我正在使用高亮插件。。。

---

搜索Fn:

function search(query) {
    $("center").removeHighlight();
    $(".paragraph").highlight(query);
    $(".highlight").each(function (index) {
        $(this).attr("id", "tmpforgoToByClassScrollhighlight" + index);
    });
}

Answer 1

尝试改用.on(...)：

$("#querybox").on("keyup", function(e) {
    var code = (e.keyCode ? e.keyCode : e.which);
    var queryBox = this;
    if (code === 13) {   // PRESSED ENTER
       queryBox.blur();
    }
    else {
        search(queryBox.val());
    }
});

---

更新后：

你可能想更好地了解一下你是如何实现搜索功能的。

缓存一些jQuery元素，这样就不会在每次设置关键帧时反复选择它们。

此外，我没有浏览所有的.highlight代码，但其中可能有一个错误，不允许使用空字符串，这就是网站导致浏览器崩溃的原因。

Answer 2

您应该使用.delete（）代替

$(document).ready(function() {
//It will be a good advice to replace body with a parent element of #querybox
$("body").delegate("#querybox","keyup", function(e) {
 var code = (e.keyCode ? e.keyCode : e.which);
  if (code == 13) {
    $("#querybox").blur();
  }
  else {
    search(document.getElementById('querybox').value);
  }
  /*if (document.getElementById('querybox').value == "") {
    $("center").removeHighlight();  
   }*/
 });
});