同时绑定onpropertychange 和 oninput 事件，实时检测 input、textarea输入改变事件，支持低版本IE，支持复制粘贴...
生活随笔
收集整理的這篇文章主要介紹了
同时绑定onpropertychange 和 oninput 事件，实时检测 input、textarea输入改变事件，支持低版本IE，支持复制粘贴...
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
實(shí)時(shí)檢測(cè) input、textarea輸入改變事件，支持低版本IE，支持復(fù)制粘貼
檢測(cè)input、textarea輸入改變事件有以下幾種：
1、onkeyup/onkeydown?捕獲用戶鍵盤輸入事件。 缺陷：復(fù)制粘貼時(shí)無(wú)法檢測(cè) 2、onchenge 缺陷：要滿足觸發(fā)條件：當(dāng)前對(duì)象的屬性改變（由鍵盤或鼠標(biāo)觸發(fā)）且對(duì)象失去焦點(diǎn) 3、onpropertychange?當(dāng)前對(duì)象屬性改變就會(huì)觸發(fā) 缺陷：只支持低版本IE 4、oninput?和onpropertychange類似，當(dāng)前對(duì)象屬性改變就會(huì)觸發(fā) 缺陷：不支持低版本IE 可以看出以上幾種方法都有各自的缺陷，1和2一般不能滿足需求，3和4的缺陷正好互補(bǔ)，兩個(gè)事件結(jié)合起來(lái)使用可以兼容IE、firefox、chrome； 所以同時(shí)綁定onpropertychange 和?oninput 可以達(dá)到實(shí)時(shí)檢測(cè)輸入內(nèi)容的目的 （jquery用propertychange?和?input）。 代碼實(shí)例（jquery）： <!--superGG1990原創(chuàng)發(fā)表于博客園http://www.cnblogs.com/superGG1990，其他商業(yè)網(wǎng)站轉(zhuǎn)載均為盜版，個(gè)人博客網(wǎng)站轉(zhuǎn)載請(qǐng)注明出處 2017-05-12--> <!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>監(jiān)聽(tīng)輸入事件</title><script type="text/javascript" src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script><style>b {color:red; font-size:18px;}</style> </head> <body><textarea style="width:800px; height:300px;"></textarea><div>你已經(jīng)輸入了<b>0</b>個(gè)字</div><script>$('textarea').on('input propertychange',function(){var val = $(this).val()var textNum = val.length;if(textNum > 200){textNum = 200;}$('b').html(textNum)//超過(guò)200個(gè)字提示if(val.length>200){var textVal = val.substring(0,200)$(this).val(textVal)alert('評(píng)論內(nèi)容大于200字')}})</script> </body> </html>原文出處 superGG1990 ?www.cnblogs.com/superGG1990
轉(zhuǎn)載于:https://www.cnblogs.com/baiyangyuanzi/p/6856598.html
總結(jié)
以上是生活随笔為你收集整理的同时绑定onpropertychange 和 oninput 事件，实时检测 input、textarea输入改变事件，支持低版本IE，支持复制粘贴...的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： win10下怎么运行java,如何在Wi
- 下一篇： Map value类型不同的写法