oninput事件、onchange事件區別
阿新 • • 發佈:2019-01-11
onchange :元素髮生改變時呼叫,在元素失去焦點時呼叫方法
onInput :元素髮生改變時呼叫,元素變化,立即觸發方法
最近專案用easyUI的easyui-combobox寫了一個可搜尋的下拉框,但是出現一個問題:比如輸入“本體”,不點空格或者回車,用滑鼠選擇“本體”,則不觸發onchange事件,不能按輸入的名稱查詢。
然後想到用oninput事件,雖然會浪費一點(每次都觸發查詢)。
events:{input: xxx_SearchBox_Name.input}
按名稱查詢:<input type="text" class="easyui-combobox" id="xxx_SearchBox_Name" style="width:270px" data-options=" valueField:'id' , textField:'fullpathname', loader : myloader, mode : 'remote', onSelect:xxx_SearchBox_Name.onSelect, events:{input: xxx_SearchBox_Name.input}" />
以下為script:
//檢索事件 var myloader = function (param, success, error) { var q = param.q || ''; if (q.length <= 0) { return false; } $.ajax({ url: 'Dxxe/GxxxyName.action', type: 'POST', dataType: 'json', data: {'xxicName': q}, success: function (data) { $('#xxx_SearchBox_Name').combobox("loadData", data); } }); }; // 滑鼠點選的時候,也觸發change事件 xxx_SearchBox_Name.input = function () { myloader({"q":this.value}); $('#xxx_SearchBox_Name').combobox('setValue',this.value); }