input動態賦值後怎麼觸發change事件

input常常用的事件有oninput與onchangejavascript

oninput:事件在用戶輸入時觸發。html

onchange:事件在內容改變(兩次內容有可能仍是相等的)且失去焦點時觸發java

可是當咱們給元素賦值時並不會觸發上面的2種事件,若是咱們想賦值後觸發上面的事件,能夠採用下面的方法函數

1、js 實現方法this

<input type="text" id="demo" onchange="txtChange(this)" />
<script type="text/javascript">
    var element = document.getElementById("demo")
    //element.focus();
    element.value = "this is sun222"
    //txtChange()  若是隻是賦值後執行一個函數,只要調用函數便可
    if (element.fireEvent) {
        element.fireEvent('onchange');
    } else {
        ev = document.createEvent("HTMLEvents");
        //event.initEvent(eventType,canBubble,cancelable)
        //eventType:字符串值,事件的類型
        //canBubble:事件是否冒泡
        //cancelable:是否能夠用preventDefault()方法取消事件
        ev.initEvent("change", false, true);
        element.dispatchEvent(ev);
    }
    function txtChange(a) {
        alert(a.value);
    }
    </script>

2、jQuery實現方法spa

<input type="text" id="demo" />
$(document).ready(function() {
        $("#demo").change(function() {
            alert("hi")
        })
        //$("#demo").val("this is lily").change()   此種方法能夠,下面的方法也能夠
        $("#demo").val("this is lily111")
        $("#demo").trigger("change")
    })
相關文章
相關標籤/搜索