關於Input內容改變的觸發事件

2021-09-01 18:36:58 字數 1450 閱讀 9206

1、onchange

onchange 事件會在域的內容改變時觸發。支援的標籤, , ,。

注意:在元素的值改變了且失去焦點時觸發(兩次的值一樣不會觸發)。

缺陷:通過js**改變dom的值不會觸發,解決在js**裡改值了呼叫其change 的

function() 或者調.change()方法。

js:  1

<inputtype="text" id="cash" onchange="function()">

jquery:

1

$("#cash").change(function(){});

2、onpropertychange

onpropertychange會實時觸發,會在元素的屬性改變時就觸發事件。當元素disable=true時不會觸發。

缺陷:只在ie 下支援,其他瀏覽器不支援,用oninput來解決。

js: 

1<inputtype="text" id="cash" onpropertychange="functionname()">

3、oninput

oninput在或的值發生改變時觸發,不需要等到元素失去焦點,是實時的。它是html5的事件,可用於檢測文字類輸入框的值。

缺陷:從指令碼中修改值不會觸發事件。從瀏覽器下拉提示框裡選取值時不會觸發。ie9 以下不支援,所以ie9以下可用onpropertychange 事件代替。

解決:通過js**改變dom的值不會觸發,解決在js**裡改值了呼叫其oninput 的

functionname() 方法。

js:

1

<inputtype="text" oninput="functionname()">

jquery: 

1

$("#cash").on('input propertychange',functionname);

4、addeventlistener

addeventlistener()用於向指定元素新增事件方法。使用removeeventlistener()移除新增的事件方法。ie9以下不支援,用attachevent代替。

語法: element.addeventlistener(event, function, usecapture)

如何讓input只能輸入數字呢:

οnkeyup="value=value.replace(/[^\d]/g,'')"

關於Input內容改變的觸發事件

1 onchange onchange 事件會在域的內容改變時觸發。支援的標籤,注意 在元素的值改變了且失去焦點時觸發 兩次的值一樣不會觸發 缺陷 通過js 改變dom的值不會觸發,解決在js 裡改值了呼叫其change 的function 或者調.change 方法。js inputtype te...

input 內容改變的觸發事件

1.onchange onchange 事件會在域的內容改變時觸發。支援的標籤,注意 在元素的值改變了且失去焦點時觸發 兩次的值一樣不會觸發 缺陷 通過js 改變dom的值不會觸發,解決在js 裡改值了呼叫其change 的function 或者調.change 方法。js function jqu...

input標籤內容改變的觸發事件

1.onchange事件與onpropertychange事件的區別 onchange事件在內容改變 兩次內容有可能相等 且失去焦點時觸發 onpropertychange事件是實時觸發,每增加或刪除乙個字元就會觸發,通過js改變也會觸發該事件,但是該事件是ie專有。2.oninput事件與onpr...