zoukankan      html  css  js  c++  java
  • 输入框检索内容,html标签内检索

    @{
    ViewData["Title"] = $"验收部位";
    }
    
    <div class="row no-gutters align-items-center">
    <div class="col-3">关键词查询:</div>
    <div class="col-6 search_box"><input type="text" class="form-control" placeholder="请输入关键词" id="search">
    
    </div>
    <div class="col-1"></div>
    <div class="col-2">
    <button type="button" class="btn btn-primary btn-sm">新建</button>
    </div>
    
    </div>
    <hr />
    <div class="search_content search_default">
    <ul class="list-group list-group-flush" id="childList">
    <li class="list-group-item"><a>8轴交G轴</a></li>
    <li class="list-group-item"><a>8轴交Y轴</a></li>
    <li class="list-group-item"><a>8轴交J轴</a></li>
    <li class="list-group-item"><a>8轴交H轴</a></li>
    <li class="list-group-item"><a>8轴交U轴</a></li>
    </ul>
    
    </div>
    
    @section styles{
    }
    
    @section scripts{
    <script type="text/javascript">
    $(function () {
    var search_input = $(".search_box input"),
    search_content = $(".search_content");
    $(search_input).on("keyup", function () {
    if (search_input.val() == '') {
    $(search_content).show();
    }
    $(".search_content li:contains(" + search_input.val().trim() + ")").show();
    $(".search_content li:not(:contains(" + search_input.val().trim() + "))").hide();
    
    
    
    });
    });
    
    </script>
    
    }
  • 相关阅读:
    各种有趣言论收集
    人类未来进化方向恶考
    mysql 列所有表行数
    恩,有那么一个人
    00后厉害哇
    。。。。
    放弃微博,继续回来写月经
    嘿,大家还好吗
    git
    require js
  • 原文地址:https://www.cnblogs.com/njccqx/p/13527328.html
Copyright © 2011-2022 走看看