jquery中的on input事件常常被用于監聽文本輸入框的輸入動作,當用戶在文本框中輸入了字符,此事件就會被觸發。
$("input[type='text']").on("input", function(){ console.log("User input: " + $(this).val()); });
在這段代碼中,我們使用了jQuery選擇器選中了所有文本輸入框,然后對它們進行了on input事件的監聽。當事件觸發時,我們打印出輸入框的值,這樣就可以實時的獲取到用戶的輸入了。
需要注意的是,on input事件并不是所有瀏覽器都支持,因此我們需要檢查瀏覽器是否支持此事件,如果不支持,則需要使用其他的事件來替代。比如,在舊版的IE瀏覽器中可以使用on propertychange事件來監聽文本框內容的變化。
$("input[type='text']").on("propertychange", function(){ console.log("User input: " + $(this).val()); });
除了文本輸入框外,on input事件也可以用于監聽其他可編輯的DOM元素,比如textarea元素。
$("textarea").on("input", function(){ console.log("User input: " + $(this).val()); });
總之,on input事件是一個非常實用的事件,可以幫助我們更加精確的監聽用戶的輸入行為。在編寫表單交互類的網站時,經常會用到這個事件。