javascript - jQuery/javascript:Webkit clearTimeout问题

在上一个问题的后面，我在Webkit浏览器Safari和Chrome中使用以下代码遇到了一些麻烦：-

// Textarea focus out event.
var renderHandler;


$("textarea").live('focusout', function (e) {
   var currentNote = this;
   renderHandler = setTimeout( function(){ renderNote(currentNote); }, 100);
});

// handle exceptions
$('.textEdit').live('focusin', function (e) {
   clearTimeout(renderHandler);

});



function renderNote( note ){
var itemContent = $(note).val();
    itemContent = htmlStrip(itemContent);
    itemContent = itemContent.replace(/\n/g, "<br/>"); // New lines
    //itemContent = itemContent.replace(/\s/g, " &nbsp;"); // Spaces

// Formatting replacements
itemContent = itemContent
    .replace(/\[b\]/gi, "<b>")
    .replace(/\[\/b\]/gi, "</b>")
    .replace(/\[i\]/gi, "<i>")
    .replace(/\[\/i\]/gi, "</i>")
    .replace(/\[s\]/gi, "<s>")
    .replace(/\[\/s\]/gi, "</s>");

$(note).replaceWith("<p class='notes'>"+ itemContent +"</p>");
}

在firefox中，renderHandler上的最新clearTimeout阻止调用函数“ renderNote”，这使我可以处理focusout事件上的异常。但是，在Webkit浏览器中，无论如何都将调用renderNote。

我尝试过返回，返回false，preventDefault，stopPropagation，中断但没有乐趣。有人遇到过吗？

此处是链接：http://www.kryptonite-dove.com/sandbox/animate

如果双击正文，然后单击便笺的正文，便可以看到它的作用。

最佳答案

注意，$.live()已过时；应该使用$.on()或$.delegate()代替。出于某种原因，正确使用这两种方法仍在逃避我的注意，因此我无法提出方法，但是您应该考虑避免使用$.live()，因为它最终会被删除，从而导致性能问题。 。

据我所知，这行代码：

$('.textEdit').live('focusin', function (e) {

从不在Chrome中运行。可以，因为好像

$('.textEdit').live('click', function (e) {

应该工作正常。

我会修改您的方法，并在其中使用一个块变量，而不是取消超时。例如：

var renderHandler,
    blockRender = false;

$("textarea").live('focusout', function (e) {
    var currentNote = this;
    renderHandler = setTimeout(function(){
        renderNote(currentNote);
    }, 100);
});

$('.textEdit').live('click', function (e) {
    blockRender = true;
});

然后在renderNote()中：

function renderNote( note ){
    var itemContent = $(note).val();

    if (blockRender) {
        blockRender = false;
        return false;
    }

    itemContent = htmlStrip(itemContent);
    itemContent = itemContent.replace(/\n/g, "<br/>");

    itemContent = itemContent
        .replace(/\[b\]/gi, "<b>")
        .replace(/\[\/b\]/gi, "</b>")
        .replace(/\[i\]/gi, "<i>")
        .replace(/\[\/i\]/gi, "</i>")
        .replace(/\[s\]/gi, "<s>")
        .replace(/\[\/s\]/gi, "</s>");

    $(note).replaceWith("<p class='notes'>"+ itemContent +"</p>");
}

http://jsfiddle.net/TsuZn/3/