HTML中input元素的setSelectionRange()方法的詳細使用過程

HTMLInputElement.setSelectionRange 方法可以從一個被 focused 的 <input> 元素中選中特定範圍的內容。

在較新的瀏覽器中,你可以通過一個可選的 selectionDirection 來指定文本選中過程中的方向。比如通過點擊和拖動從結束位置往起始位置選中一個字符串。

每次調用這個這個方法會更新 HTMLInputElement 的 selectionStartselectionEnd,和 selectionDirection 屬性。

語法

inputElement.setSelectionRange(selectionStart, selectionEnd, [optional] selectionDirection);
參數

selectionStart

被選中的第一個字符的位置。selectionEnd被選中的最後一個字符的 下一個 位置。selectionDirection (可選)一個指明選擇方向的字符串,有"forward","backward"和"none" 3個可選值, 分別表示"從前往後", "從後往前"和"選擇方向未知或不重要"。


例子

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<title>JS Bin</title>
<script>
function SelectText () {
        var input = document.getElementById("mytextbox");
            input.focus();
            input.setSelectionRange(2,5);   // 選擇特定部分
            input.setSelectionRange(0, -1); // 全選

}
</script>
</head>
<body>
  <p><input type="text" id="mytextbox" size="20" value="Mozilla"/></p>
  <p><button onclick="SelectText()">Select text</button></p>
</body>
</html>

實現效果



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章