输入框检索内容,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> }