最近以就此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 })

 

 

 

 

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事件

    这个点子可以监听每个按键的触发事件,可以把模糊查询方式绑定到应的风波及,每本平不成就是会见接触一不成模糊查询的轩然大波,但是这样做会大大加数据库的下压力,如果人大半操作以尚未缓存的话,数据库会分开分钟炸掉。

    

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值发生变化,就会见动态调用响应的艺术。

    图片 1

图片 2

图片 3

图片 4

 

    最后值得一游说的凡,获取input的text框里面的value值有三种植方法.

      1.透过attr(“value”)获取。这种艺术赢得只能落默认的。也就是说,你css代码里面原来定义的value值是稍稍,页面第一次表现的也是有点,而且此价值未会见转移。

      2.通过prop(“value”)获取。这种办法会获得默认的,也会博得反或者的价值,只要您改变了便能够赢得到。

      3.通过val()获取。这个感觉与prop(“value”)差不多。

      4.呢得据此Vue.js的v-model绑定获取到,那便到底4种艺术吧。

    以上这些还只是是止是个人多次测试得出的下结论。并不曾呀大的说法,如果发生不当,希望大神能够就指正。

 

相关文章

网站地图xml地图