码迷,mamicode.com
首页 > Web开发 > 详细

js实现数据的双向绑定

时间:2019-01-25 16:31:29      阅读:179      评论:0      收藏:0      [点我收藏+]

标签:event   target   span   efi   ntb   属性   对象   func   col   

今天用原生js来实现一个数据的双向绑定

知识点:object.defineProperty()

  三个参数:

    第一个:要定义属性的对象,

    第二个:要定义或者修改的属性的名称

    第三个:将被定义或者修改的属性的描述

 

<input type="text" id="inp"/>
<p id="showText"></p>
<script>
  var obj = {};
  Object.defineProperty(obj,"newProp",{
    get:function(){
      return obj;
    },
    set:function(newVal){
      document.getElementById("inp").value = newVal;
      document.getElementById("showText").innerHTML = newVal;
    }
  })
  document.addEventListener("keyup",function(e){
    obj.newProp = e.target.value;
  })
</script>

 

js实现数据的双向绑定

标签:event   target   span   efi   ntb   属性   对象   func   col   

原文地址:https://www.cnblogs.com/ly-qingqiu/p/10320222.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!