input 輸入框 propertychange
阿新 • • 發佈：2018-01-11
發的 效果 key 條件 clas input log style type
做搜索功能的時候，經常遇到輸入框檢查的需求，最常見的是即時搜索，今天好好小結一下。
即時搜索的方案：
（1）change事件 觸發事件必須滿足兩個條件：
a）當前對象屬性改變，並且是由鍵盤或鼠標事件激發的（腳本觸發無效） b）當前對象失去焦點(onblur) （2）keypress 恩，還好。。。。。就是能監聽鍵盤事件，鼠標復制黏貼操作他就無能為力的趕腳了。。。。。 （3）propertychange（ie）和input事件 input是標準的瀏覽器事件，一般應用於input元素，當input的value發生變化就會發生，無論是鍵盤輸入還是鼠標黏貼的改變都能及時監聽到變化propertychange，只要當前對象屬性發生改變。
下面我們用jquery 來實現input 等同於placeholder 這個屬性的效果
html
<div class="enterprise-list">
<label>銀行卡號：</label>
<input type="text" placeholder="請輸入16或19位銀行卡號" class="enterprise-inp" id="cartInput">
</div>
js
<script>
$(function () {
$("#cartInput").bind(‘input propertychange‘,function () {
var text = $("#cartInput").val();
text = text.replace(/[^\d]/g,‘‘);
console.log(text)
})
})
</script>
input 輸入框 propertychange