input 使用js赋值而非手动输入input，并执行input事件对应函数

104 阅读 0 评论 69 点赞

我是靠谱客的博主大意机器猫，最近开发中收集的这篇文章主要介绍input 使用js赋值而非手动输入input，并执行input事件对应函数，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

2019独角兽企业重金招聘Python工程师标准>>>

背景：在开发过程中需要用到layui的下拉列表，且需要在隐藏输入框的时候保持输入搜索功能，因此需要使用js赋值给input并调用input事件对应的函数

经试验，由于作用域的不同，在layui源码中定义监听input的input,change,propertychange,blur事件，在comment.js中激发该input的这些事件并不会触发执行对应的函数，因此转而研究数据的双向绑定原理，使用封装属性访问器实现这一功能

var jsinput = undefined;  
Object.defineProperty(input[0], 'jsinput', {  
   get: function() {  
     return input[0].value;  
   },  
   set: function(value) {  
     input[0].value=jsnput = value; 
    var mmm=function(v){ console.log(v); }
     mmm(value);
   }  
 });

当执行input.prop("jsinput","aaa")时，会执行mmm函数，输出aaa

转载于:https://my.oschina.net/u/3552749/blog/1606434