input輸入框的input事件和change事件


      input輸入框的onchange事件,要在 input 失去焦點的時候才會觸發

      在輸入框內容變化的時候不會觸發change,當鼠標在其他地方點一下才會觸發;

     onchange 事件也可用於單選框與復選框改變后觸發的事件。

     demo如下: 

<script>
    function myFunction(){
        var x=document.getElementById("fname");
        x.value=x.value.toUpperCase();
     }
</script>
</head>
<body>

   輸入你的名字: <input type="text" id="fname" onchange="myFunction()">
   <p>當光標離開輸入框后,函數將被觸發,將小寫字母轉為大寫字母。</p>
</body>

 

    onchange事件兼容性

     onchange event 所有主要瀏覽器都支持;

     onchange 屬性可以使用於:<input>, <select>, 和 <textarea>

 

     INPUT事件

     oninput 事件在用戶輸入時觸發,它是在元素值發生變化時立即觸發;

     該事件在 <input> 或 <textarea> 元素的值發生改變時觸發。

      缺陷:從腳本中修改值不會觸發事件。從瀏覽器下拉提示框里選取值時不會觸發。IE9 以下不支持,所以IE9以下可用onpropertychange 事件代替。

   

     onpropertychange事件

     onpropertychange會實時觸發,會在元素的屬性改變時就觸發事件。當元素disable=true時不會觸發。
     缺陷:只在IE 下支持,其他瀏覽器不支持,用oninput來解決。
    

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM