jq实现回车搜索事件功能 jq如何来判断input光标是否获取焦点或失去焦点

作者：鹏仔先生日期：2020-06-03 14:25:43浏览：3101分类：JavaScript

平时写搜索功能时候，很多用户喜欢回车搜索，有利于功能体验。本次简单写个demo，供大家使用。

jq请自行引入

在线运行

<div>
	<input class="search" type="text" placeholder="请输入搜索内容">
	<button class="submit">搜索</button>
</div>

<script>
    // 监听回车事件
    $(document).keyup(function(event){
        var isFocus = $(".search").is(":focus");
        // 判断光标是否在input上
        if(isFocus == true){
            // 如果光标在 则触发回车事件
            if(event.keyCode == 13){
                $(".submit").click();
            }
        } else {
            // 光标不在 则不执行任何事件
        }
    })
    // 搜索执行的事件
    $(".submit").click(function(){
    	alert("触发搜索");
    })
</script>