js 文本框文本域focus時自動選中內容
阿新 • • 發佈：2018-11-14
長度 3.1 mage param ont NPU pcb 自動選擇 引入
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>自動選擇</title> <link rel="stylesheet" href=""> </head> <body> <h1>focus時自動選中內容</h1> <inputtype="text" autoselect start="2" end="4" value="這是內容這是內容這是內容"> <br><br> <textarea autoselect>這是內容這是內容這是內容</textarea> <!-- 引入jquery --> <script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="crossorigin="anonymous"></script> <script> /** * 自動選擇文本框/文本域中的內容 * @param {dom} e [必填，必須是input或者textarea] * @param {開始索引值} s [默認:0] * @param {[type]} t [默認：總長度] * @return {[type]} [null] */ function autoselect(e,s,t){ var startIndex= s ? Number(s) : 0; var stopIndex = t ? Number(t) : $(e).val().length; if (e.setSelectionRange) { e.setSelectionRange(startIndex, stopIndex); } else if (e.createTextRange) { var range = e.createTextRange(); range.collapse(true); range.moveStart(‘character‘, startIndex); range.moveEnd(‘character‘, stopIndex - startIndex); range.select(); } e.focus(); } $("[autoselect]").on("focus",function(e){ var start = $(this).attr("start"); var end = $(this).attr("end"); autoselect(this, start , end); }); </script> </body> </html>
效果：
js 文本框文本域focus時自動選中內容