javascript - 谷歌浏览器，无限循环和选择文本

Question

这个问题有一些背景知识。请查看我最近发布的另外两个相关问题:

How to select text in a textbox cross-browser
Infinite loops created in google chrome

警告:第二个链接可能是误导。

好的，所以我的问题是我正在尝试使用它，以便当用户首次单击或跳转到文本框时，所有文本都应该被选中。如果文本框具有焦点，则随后单击文本框内的文本应该会正常运行(即不会重新选择所有文本)。我在上面第一个链接中选择的答案是我发现适用于所有浏览器的答案。为了您的方便，下面发布了代码:

$('input[type="text"]').live('focus', function (event) {
    var inp = this;
    setTimeout(function () {
        inp.select();
    }, 1);

    event.stopPropagation();
    event.preventDefault();
    return false;    
});

现在我上面的第二个链接是我似乎使用这种方法遇到的问题。似乎间歇性地，谷歌浏览器卡在某个地方并开始非常快速地改变文本框之间的焦点。你可以在这里看到我认为正在发生的事情:http://jsfiddle.net/ajbeaven/XppG9/14/

正如我所说，这似乎是一个间歇性问题，因此您可能需要尝试重新加载页面几次，以了解我认为可能导致焦点改变的原因。请记住，它似乎只发生在 chrome 中。

感谢任何可以阐明的人!

Answer 1

将任何额外的工作放在 setTimeout 函数中。并在 setTimeout() 之前添加一个 clearTimeout():

var focusTimeout = 0;
$('input[type="text"]').live('focus', function(event) {
    var inp = this;
    clearTimeout(focusTimeout);
    focusTimeout = setTimeout(function() {
        $('#message-container').html($('#message-container').html() + "*\u200b");
        inp.select();
    }, 1);
});

http://jsfiddle.net/XppG9/19/

在 Chrome 中，将 html 写入页面(显然)导致字段失去焦点，select() 导致它在 1ms 后获得焦点，从而触发焦点事件并导致无限循环。将写入 html 调用移动到选择文本的函数中似乎可以解决问题。