近日在用jQuery达成动态模糊查询的时候,找了挺久都并未找到像Vue.js的watch属性这么好用的动态模糊查询方式。就享受一下当下境遇的坑和能够兑现动态查询的二种方法。

  1.jQuery的change()方法。

   那么些主意要错过所在的input框的热点时,事件才会被触发,感觉有点鸡肋,也有恐怕是小编从没完全会熟用那个格局,希望懂的大神能够享受一下采纳秘籍。

    

1 <input type="text" id="n3"/>
2 
3 
4 var $n3=$("#n3);//定位到input框
5 $n3.change(function(){
6     this.query_search($n3.val());//query_search为模糊查询的方法
7 })

 

 

 

jQuery, 

change()函数用于为每一种匹配成分的change事件绑定处理函数。该函数也可用于触发change事件。其它,你还足以附加传递给事件处理函数一些数码。change事件会在文件内容或选择被改变时接触。该事件仅适用于<input
type=”text”>和<textarea>以及<select>。对于text和textarea成分,该事件会在要素失去核心时发生(文本内容也时有爆发了变更)。其它,你能够为同一成分数次调用该函数,从而绑定多少个事件处理函数。触发change事件时,jQuery会遵照绑定的先后顺序依次执行绑定的事件处理函数。要删减通过change()绑定的事件,请使用unbind()函数(本段摘自http://www.365mini.com/page/jquery-change.htm)。

  2.监听JQuery的keyup或者keydown事件

    这一个法子能够监听各种按键的触及事件,可以把模糊查询格局绑定到响应的轩然大波上,每按2回就会接触一回模糊查询的风云,但是这么做会大大扩大数据库的下压力,假若人多操作而且尚未缓存的话,数据库会分分钟炸掉。

    

1 <input type="text" id="#n3"/>
2 
3 var $n3=$("#n3");//定位到input框
4 $n3.keyup(function(){
5    this.query_search($n3.prop("value"));//query_search为模糊查询的方法 
6 })

  3.应用Vue.js的watch属性观看者方法。

    那一个艺术能够动态观看input框里面包车型客车性格别变化化意况,只要input框的value值发生变化,就会动态调用响应的方法。

    jQuery 1

jQuery 2

jQuery 3

jQuery 4

 

    最后值得一说的是,获取input的text框里面包车型客车value值有二种方法.

      1.经过attr(“value”)获取。那种艺术得到只好获取暗中认可的。相当于说,你css代码里面原来定义的value值是稍微,页面第3遍表现的也是多少,而且那几个值不会变。

      2.通过prop(“value”)获取。那种方法能获取默许的,也能博取改变或的值,只要您转移了就能收获到。

      3.因此val()获取。那个感觉和prop(“value”)差不离。

      4.也得以用Vue.js的v-model绑定获取到,这就到底4种办法吧。

    以上这一个都只是只是私有多次测试得出的定论。并不曾什么权威的布道,假如有荒唐,希望大神能够马上指正。

 

相关文章

网站地图xml地图