关闭

JS实现回车搜索的两种方法

标签: 前端回车搜索javascript
2956人阅读 评论(0) 收藏 举报
分类:

JS实现回车搜索的两种方法

1.方法一:

functionhuichesearch(){//回车搜索
    varevent =window.event||arguments.callee.caller.arguments[0];
    if(event.keyCode== 13){
        search();//搜索函数
    }
}

l 代码解释:当window触发事件或者函数被调用触发事件时,判断是否按下回车键(keyCode=13),按下回车键时进行搜索。

l window.event代表事件对象的状态,只有在事件(如鼠标、键盘等事件)被触发时这个对象才存在。

l arguments.callee指函数体本身,即huichesearch()函数本身;

l arguments.callee.caller.指函数体的调用函数体;

l Arguments.callee.caller.arguments[0]指事件对象。

2.方法二:(考虑到浏览器兼容性)

function huichesearch(e){//回车搜索
    
varkeyCode =window.event? e.keyCode:e.which;
    if(keyCode== 13){
        search();//搜索函数
    }
}

代码解释:

which 和 keyCode 属性提供了解决浏览器的兼容性的方法:

l keyCode属性返回onkeypress事件触发的键的值的字符代码,或者 onkeydown 或 onkeyup 事件的键的代码。

浏览器支持:

 

注意:在 Firefox 中,keyCode 属性在 onkeypress 事件中是无效的 (返回 0)。浏览器兼容问题,可以一起使用 which 和 keyCode 属性来解决:

var keyCode = window.event ? e.keyCode:e.which;

l which 属性返回onkeypress事件触发的键的值的字符代码,或者 onkeydown 或 onkeyup 事件的键的代码

浏览器支持:

 

l Event.which:http://api.jquery.com/event.which/

3.总结

l 回车搜索的思路:获取触发事件--做判断是否为回车事件--做搜索处理。

l 解决兼容性问题就一起使用 which 和 keyCode 属性来解决

0
0
查看评论

JS实现搜索框绑定回车键示例

window.onload = function(){   } function check() { var bt = document.getElementById("bt"); var key = event.keyCode; if (key =...
  • fishineye
  • fishineye
  • 2013-11-29 15:07
  • 5158

给搜索框添加回车事件

function search(){ //alert("test"); keyword=$("#gover_search_key").val(); turnkeyword = escape(keyword); kuaizhao.href="sn...
  • woshirsn
  • woshirsn
  • 2016-10-18 09:59
  • 4412

Jquery搜索框获取回车事件

<!--不能用form表单--> <!DOCTYPE html><html> <head> <title></title> <script src="js/jquery-1.10.2.min.js...
  • ptspzy
  • ptspzy
  • 2015-07-15 10:51
  • 2935

js捕获页面回车事件

使用纯JavaScript和Jquery实现页面回车按键的捕获
  • yzj714839128
  • yzj714839128
  • 2016-07-12 13:31
  • 8621

js实现回车键换下一行

function focusNextInput(thisInput) { var inputs = document.getElementsByTagName("input"); for(var i = 0;i&...
  • gdali
  • gdali
  • 2017-08-18 09:50
  • 601

Algolia Search - 使用Javascript实现前端实时搜索

在网站开发中,很重要的一个功能那就是搜索了。对于一个访问量很大的网站来说,对于所有的搜索请求直接读取数据库来完成将会造成非常大的负荷。两种办法可以有效地解决以上问题,第一种就是缓存,memcached,redis等都很有名气,在这里就不予赘述了。 那么第二种就是使用云搜索。什么是云搜索?类似于CD...
  • lgyaxx
  • lgyaxx
  • 2017-04-24 23:18
  • 2165

JavaScript 模拟键盘事件和鼠标事件(比如模拟按下回车等)

原文链接: 最近代码中有个功能需要用到手动触发键盘事件的功能。但键盘事件的fire在各浏览器下实现不一样,下面分别说明: 1. IE下没什么问题,创建事件对象、对对象的keyCode属性赋值,然后再抛出来就行了: evtObj = document.create...
  • lovelyelfpop
  • lovelyelfpop
  • 2016-09-08 15:23
  • 17652

JS模拟按下回车方法

项目中需要用到模拟按下回车的方法,网上找了好多都是监听回车事件的,不过最终还是让我再某大佬的帖子里找到了这段代码。 记录一下,以免以后又忘了。 这个是大佬的原文,里面的ctrlKey没试过,看意思大概是ctrl键 var evt = $.Event('keydown',...
  • sbin456
  • sbin456
  • 2017-12-26 13:49
  • 106

手机端 调用输入法 上的搜索键 进行搜索的使用方法

如果基于原生的js或者jq的写法可以如此: <form action="javascript:search();"> <input type="search" placeholder="请输入搜索内容"&...
  • sinat_33750162
  • sinat_33750162
  • 2017-03-22 10:58
  • 2323

JS实现回车搜索

页面代码 PS:不能使用form标签 JS代码 function entersearch(){ var event = window.event || arguments.callee.caller.arguments[0]; if (event.keyCode == 13) ...
  • Foxsbox
  • Foxsbox
  • 2017-06-01 14:44
  • 171
    个人资料
    • 访问:16136次
    • 积分:377
    • 等级:
    • 排名:千里之外
    • 原创:22篇
    • 转载:1篇
    • 译文:0篇
    • 评论:0条