文本框实时搜索

最新推荐文章于 2018-07-04 23:24:47 发布

yaoyyl

最新推荐文章于 2018-07-04 23:24:47 发布

阅读量1k

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/yaoyyl/article/details/76026514

版权

前端专栏收录该内容

45 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>文本框实时搜索</title>
</head>
<body>
<input id="searchInp" type="text" placeholder="请输入">
<h2 id="test"></h2>
<script src="http://apps.bdimg.com/libs/zepto/1.1.4/zepto.min.js"></script>
<script>
    $(document).ready(function(){
        var searchTimer=null;
        $('#searchInp').on('input', function(e){
            clearTimeout(searchTimer);
            searchTimer = setTimeout(function(){
                $('#test').html(e.target.value)
                if(e.target.value === ""){
                    console.log('空')
                } else {
                    console.log('e.target.value='+e.target.value);
                }
            }, 300);
        });
    })
</script>
</body>
</html>

yaoyyl

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
文本框实时搜索

html> charset="UTF-8"> 文本框实时搜索id="searchInp" type="text" placeholder="请输入">id="test">src="http://apps.bdimg.com/libs/zepto/1.1.4/zepto.min.js"> $(document).ready(function(){
复制链接

扫一扫

专栏目录