把代碼復制放到頁面里面運行看一下效果就好了
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><input type="text" id="myinput" ><script> function watch(obj,key,callback) { var old = obj[key]; Object.defineProperty(obj,key,{ set:function(val){ var oldVal = old; old = val; callback(val,oldVal,this); }, get:function(){ return old; } }); } var input = document.getElementById("myinput"); var obj = {}; watch(obj, "input",function (val) { input.value = val; console.log("這里是不管view層,還是module層修改后的回調,最后設置的值是"+val); }); input.onkeyup = function () { obj.input = input.value; };</script></body></html>代碼測試
修改了input內的值,會看到控制臺打印出新的值
在控制臺修改obj.input的值,input框內的值也會跟著改變,也會觸發事件,獲取新值
以上這篇js最簡單的雙向綁定實例講解就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持武林網。
新聞熱點
疑難解答