当前位置：网站首页>JS to implement bidirectional data binding

JS to implement bidirectional data binding

2022-06-27 05:54:00 【Small dark】 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <input type="text" value="1" id="input">
    <script>
        var obj ={
    }
        var input = document.getElementById('input');
        Object.defineProperty(obj, "txt", {
    
            get: function(){
    
                console.log(" Reading data ");
                return input.value;
            },
            set: function(val){
    
                console.log(" Modifying data ", val);
                input.value = val;
            }
        })
        input.addEventListener("keyup", function(e){
    
            obj.txt = input.value;
        })
    </script>
</body>
</html>

Insert picture description here

原网站

版权声明
本文为[Small dark]所创，转载请带上原文链接，感谢
https://yzsam.com/2022/178/202206270541087397.html

边栏推荐

猜你喜欢

随机推荐