Javascript:用于选择焦点文本框内所有文本的跨浏览器解决方案

Javascript: cross browser solution for selecting all text inside a textbox on focus

本文关键字：文本 解决方案 浏览器 用于 选择 焦点 Javascript      更新时间：2023-09-26

我想要以下功能:

  • 用户点击或加入文本框
  • 文本框中的所有文本被选中，除非文本框已经有焦点，在这种情况下，默认的点击/选择功能应该发生

这可能吗?

$('input[type="text"]').live('focus', function () {
    this.select();
});
http://jsfiddle.net/HmQxZ/13/

Chrome和IE8选择所有的文本只有一瞬间

$('input[type="text"]').live('click', function () {
    this.select();
});
http://jsfiddle.net/HmQxZ/12/

Firefox和IE8选择所有文本，但在随后的点击中，文本仍处于选中状态。

*的工作，文本框有焦点后，点击它之间选择所有的文本和能够点击闪烁的插入符号的位置。

使用setTimeout:

将其延迟一毫秒
$('input[type="text"]').live('focus', function() {
    var inp = this;
    setTimeout(function() {
        inp.select();
    }, 1);
});
http://jsfiddle.net/HmQxZ/14/

发生的是其他浏览器事件在你选择文本后设置选择。因此，通过等待一毫秒，您可以让所有浏览器事件完成，然后选择文本。

您可能需要添加

event.preventDefault();
return false;

到您的函数(第一个)。这可能会修复其他浏览器。

同时，将event添加到函数签名中:

$('input[type="text"]').live('focus', function (event) {

如果你可以使用jQuery，那么你可以做一些像;

$("#myInputField").focus(function(){
    // Select input field contents
    this.select();
});
// Add this behavior to all text fields
$("input[type=text]").focus(function(){
    // Select field contents
    this.select();
});

引自此处

你应该记住这样做一个return false; event.stopPropagation(); event.preventDefault():

$('input[type="text"]').live('click', function (event) {
    this.select();
    event.stopPropagation();
    event.preventDefault();
    return false;
});
http://jsfiddle.net/7rYLV/

相关文章：