即时搜索的input和propertychange方法
2016-06-21 15:00
260 查看
做搜索功能的时候,经常遇到输入框检查的需求,最常见的是即时搜索,今天好好小结一下。
即时搜索的方案:
(1)change事件 触发事件必须满足两个条件:
a)当前对象属性改变,并且是由键盘或鼠标事件激发的(脚本触发无效)
b)当前对象失去焦点(onblur)
(2)keypress 恩,还好。。。。。就是能监听键盘事件,鼠标复制黏贴操作他就无能为力的赶脚了。。。。。
(3)propertychange(ie)和input事件
input是标准的浏览器事件,一般应用于input元素,当input的value发生变化就会发生,无论是键盘输入还是鼠标黏贴的改变都能及时监听到变化
propertychange,只要当前对象属性发生改变。
比如一个input输入文字后出现下拉框,如图:
![](http://img.blog.csdn.net/20160621145225533?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center)
当输入框里面内容为空时,下拉框要隐藏,可以通过input和propertychange方法实现,代码如下:
<script>
$("#search").bind("input propertychange",function(){
var value=$(this).val();
if(value){
$(".pc_search ul").show();
}else{
$(".pc_search ul").hide();
}
});
</script>这里bind同时绑定了input和propertychange两个方法。
即时搜索的方案:
(1)change事件 触发事件必须满足两个条件:
a)当前对象属性改变,并且是由键盘或鼠标事件激发的(脚本触发无效)
b)当前对象失去焦点(onblur)
(2)keypress 恩,还好。。。。。就是能监听键盘事件,鼠标复制黏贴操作他就无能为力的赶脚了。。。。。
(3)propertychange(ie)和input事件
input是标准的浏览器事件,一般应用于input元素,当input的value发生变化就会发生,无论是键盘输入还是鼠标黏贴的改变都能及时监听到变化
propertychange,只要当前对象属性发生改变。
比如一个input输入文字后出现下拉框,如图:
当输入框里面内容为空时,下拉框要隐藏,可以通过input和propertychange方法实现,代码如下:
<script>
$("#search").bind("input propertychange",function(){
var value=$(this).val();
if(value){
$(".pc_search ul").show();
}else{
$(".pc_search ul").hide();
}
});
</script>这里bind同时绑定了input和propertychange两个方法。
相关文章推荐
- linux user mysql 破解
- Linux中设置服务自启动的三种方式
- windows2008访问linux共享的nfs
- 在Linux上使用的10种云备份方案
- 【记录】NFS工具的使用
- shell 笔记
- docker + swarm 集群
- hostname的一些记录
- OpenAL简介
- XP+devOps开发模式与scrum敏捷开发对比,docker虚拟化
- Tmux 多窗口操作
- 利用elcipse和XAMPP搭建PHP+Apache+MySQL环境
- linux系统用户锁定与解锁
- 网站开发时,如何禁用Chrome谷歌浏览器自动保存密码的提示?
- 【linux】linux服务管理
- linux tar命令
- Linux设备驱动子系统第二弹 - SD卡
- 为最佳性能调优 Nginx
- linux系统启动流程
- Android架构之MVP升级版