您好,登錄后才能下訂單哦!
一、onchange事件
只在鍵盤或者鼠標操作改變對象屬性,且失去焦點時觸發,腳本觸發無效。(就是說你在輸入框中輸入完內容,輸入完了,然后鼠標點別的地方觸發該事件)
二、oninput事件
oninput 事件在用戶輸入時觸發。不支持JS等賦值改變的元素屬性。
該事件在 <input> 或 <textarea> 元素的值發生改變時觸發。(也就是說,不用輸入完,邊輸入邊觸發該事件)
①但是,這個方法是HTML5中的標準事件,IE9以下的瀏覽器是不支持oninput事件的。
②使用時,還需要oninput要通過addEventListener()來注冊.
③在不涉及js賦值等元素改變的事件,我們是可以結合onpropertychange事件使用的如:
var ie = !!window.ActiveXObject;
if(ie){
object.onpropertychange = aaaaa;
}else{
object.addEventListener("input", aaaaa, false);
};
function aaaaa(){
alert("20180829");
}
三、onkeydown事件
事件會在用戶按下一個鍵盤按鍵時發生(在輸入框敲鍵盤,就會觸發)。
在處理復制、粘貼、拖拽、長按鍵(按住鍵盤不放)等細節上并不完善
四、onkeyup事件
事件會在鍵盤按鍵被松開時發生。(手,已經按了電腦的開關了,一松手就會關機哦)
五、onkeypress事件
事件會在鍵盤按鍵被按下并釋放一個鍵時發生。(筆者認為,和onkeyup事件是類似的,可能是判斷不同瀏覽器,執行不同的方法吧)
六、onpropertychange事件
js賦值改變元素屬性也可以觸發,鍵盤鼠標操作(只要是HTML元素屬性發生改變都可以捕獲,遺憾的是IE專屬而且還是只是IE6/7/8,高版本的IE需要針對此頁面降低版本方可執行。)
七、jQuery 事件 - change() 方法
經過筆者的測試,發現這個方法與onchange事件是差不多一致的。
被動:<input type="text" id="to_change"/><br/>
主動:<input type="text" id="make_change" onchange="aaa()"/>
<script>
$("#to_change").change(function(){
alert("執行了change方法!");
});
function aaa(){
$("#to_change").val("20180829")
}
</script>
八、原生js綁定change事件
經過筆者的測試,發現這個方法與onchange事件是差不多一致的。
document.getElementById("to_change").onchange = function() {
alert('to_change');
};
``
**九、Jquery綁定文本變更事件**
**筆者有三種四種方式實現onchange事件了,這個方法也是一樣的,同樣不能處理js賦值引起元素屬性改變的問題**
$("#to_change").bind("change", function() {
alert('changed');
});
**十、筆者自寫定時器,監聽元素屬性改變事件
判斷瀏覽器與降低瀏覽器版本的問題,筆者就不寫了。**
直接上定時器,函數:
$(document).ready(function() {
// 獲得焦點時,啟動定時器
$("#make_change").focus(function(){
var aaa = setInterval(to_change,1000);
});
// 失去焦點時,清除定時器
$("#make_change").blur(function(){
clearInterval(aaa);
});
}
})
function to_change() {
//你的判斷,你要的內容
}
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。