Dieser Artikel teilt Ihnen hauptsächlich den einfachen bidirektionalen Bindungscode von js mit, um ihn auszuführen und den Effekt zu sehen.
<span style="font-size: 14px;"><!DOCTYPE html><html lang="en"><head><br/> <meta charset="UTF-8"><br/> <title>Title</title></head><body><input type="text" id="myinput" ><script><br/> function watch(obj,key,callback) {<br/> var old = obj[key]; Object.defineProperty(obj,key,{<br/> set:function(val){<br/> var oldVal = old;<br/> old = val;<br/> callback(val,oldVal,this);<br/> },<br/> get:function(){<br/> return old;<br/> }<br/> });<br/> } var input = document.getElementById("myinput"); var obj = {};<br/> watch(obj, "input",function (val) {<br/> input.value = val;<br/> console.log("这里是不管view层，还是module层修改后的回调，最后设置的值是"+val);<br/> });<br/><br/> input.onkeyup = function () {<br/> obj.input = input.value;<br/> };</script></body></html><br/></span>Wenn Sie den Wert in der Eingabe ändern, wird der neue Wert angezeigt Der Wert von
Ändern Sie den Wert von obj.input in der Konsole, der Wert im Eingabefeld ändert sich ebenfalls entsprechend und an Ereignis wird ausgelöst, um den neuen Wert zu erhalten
Verwandte Empfehlungen:
Mitteilung über drei Methoden zur Implementierung von zwei- Weg-Datenbindung in JavaScript
Zwei-Wege-Bindung von Javascript-Daten einfach implementieren_Javascript-Fähigkeiten
Vertiefendes Verständnis des Implementierungsprinzips der bidirektionalen Bindung von vue.js
Das obige ist der detaillierte Inhalt vonjs einfacher Fallcode mit bidirektionaler Bindung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
