如何取消选择文本框的文本,当它得到焦点时,当tab被按下

How to unselect the text of a textbox when it gets focus, when tab is pressed?

本文关键字:文本 焦点 tab 何取消 选择 取消      更新时间:2023-09-26

一行中有一系列文本框,用于输入时间。当用户返回到已经编辑过的文本框时,浏览器会突出显示该文本框中的文本。

  1. 当文本框成为焦点时,我该如何取消选中文本呢?
  2. 将光标设置到文本框内文本的开头?

我试过下列方法,但都没有效果:

在textboxfocushandler:

var html = $("#MyTextArea").val();
$("#MyTextArea").focus().val("").val(html);

为文本框选择处理程序:

if (window.getSelection) {
    if (window.getSelection().empty) {  // Chrome
        window.getSelection().empty();
    } else if (window.getSelection().removeAllRanges) {  // Firefox
        window.getSelection().removeAllRanges();
    }
} else if (document.selection && document.selection.empty) {  // IE?
    document.selection.empty();
}

我认为问题是浏览器在焦点处理程序执行之后才选择文本。您可以尝试使用setTimeout()来延迟代码,如下所示:

$('input').focus(function() {
    var $input = $(this);
    setTimeout(function() {
        setCaretPos($input[0], 0, 0);
    }, 0)
});
<<p> jsfiddle演示/strong>

使用如下方法设置插入符号的位置:

function setCaretPos(element, begin, end) {
    if (element.setSelectionRange) {
        element.setSelectionRange(begin, end);
    } else if (element.createTextRange) {
        var range = element.createTextRange();
        range.collapse(true);
        range.moveEnd('character', end);
        range.moveStart('character', begin);
        range.select();
    }
}

如果你决定把焦点放在文本的末尾,你可以使用:

var end = $input.val().length;
setCaretPos($input[0], end, end);
信贷:

我从jQuery掩码插件得到了setCaretPos()函数的代码。该插件包含一个.caret()插件方法,您可以使用