跨浏览器实现选中文本框指定的长度的值
可用于编辑器的功能的开发。
依赖
代码
<!DOCTYPE html>
<html> <head> <meta charset="utf-8"> <title>10.cross-browser-selectText</title> <script src="EventUtil.js"></script> <style> ul,li{ list-style:none; } </style> </head> <body> <form name="myform"> <label for="name">姓名：</label> <input type="text" name="name" autofocus id="name" placeholder="请输入姓名" value="我在哪里"><br> <input type="button" value="select-btn" id="select-btn"/> </form> <script> (function(){ var form = document.forms['myform'] var elements = form.elements var inputText = elements['name'] var btn = document.querySelector('#select-btn') EventUtil.addHandler(btn, 'click', function(event){ inputText.focus() selectText(inputText, 0, 1) }) function selectText(textbox, startIndex, stopIndex){ if (textbox.setSelectionRange){ textbox.setSelectionRange(startIndex, stopIndex); } else if (textbox.createTextRange){ var range = textbox.createTextRange(); range.collapse(true); range.moveStart("character", startIndex); range.moveEnd("character", stopIndex - startIndex); range.select(); } textbox.focus(); } })() </script> </body> </html>
效果如下：
