文本框脚本_取得文本_跨浏览器_P421

一、取得_用户在文本框中选择的文本

<!DOCTYPE html>
<html>
<head>
    <title>文本框脚本_取得选择的文本</title>
    <script type="text/javascript" src="EventUtil.js"></script>
</head>
<body>
    <p>Select some text in the textbox.</p>
    <form method="post" action="javascript:alert('Form submitted!')" id="myForm">        
        <div>
            <label for="comments">Type something:</label><br>
            <input type="text" id="txtStuff" name="stuff" value="Default value">
        </div>
        <input type="submit" value="Submit Form" id="submit-btn">
    </form>     
    <script type="text/javascript">
        (function(){
        
            function getSelectedText(textbox){
                if (typeof textbox.selectionStart == "number"){
                    return textbox.value.substring(textbox.selectionStart, 
                            textbox.selectionEnd);                
                } else if (document.selection){
                    return document.selection.createRange().text;
                }
            }
                          
            EventUtil.addHandler(window, "load", function(event){
                var textbox = document.forms[0].elements[0];
    
                EventUtil.addHandler(textbox, "select", function(event){
                    console.log(getSelectedText(textbox));
                });
    
                textbox.focus();
            });               
        })();
    
    </script>
</body>
</html>

二、取得_文本框中部分文本

<!DOCTYPE html>
<html>
<head>
  <title>Textbox Partial Selection Example</title>
  <script type="text/javascript" src="EventUtil.js"></script>
</head>
<body>


  <p>Select some text in the textbox.</p>


  <form method="post" action="javascript:alert('Form submitted!')" id="myForm">
    <div>
      <label for="comments">Type something:</label><br>
      <input type="text" id="txtStuff" name="stuff" value="Default value">
    </div>
    <input type="button" value="Select some text" id="select-btn">
  </form>


<script type="text/javascript">


(function(){
  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();
  }

  var btn = document.getElementById("select-btn");
  EventUtil.addHandler(btn, "click", function(event){
    var textbox = document.forms[0].elements[0];
    selectText(textbox, 4, 7);
  });


})();

</script>
</body>
</html>

原文地址:https://www.cnblogs.com/jiunie/p/13345491.html