[英]In-page search using contains() to show/hide div content
我正在尝试将搜索功能添加到我的常见问题解答页面并且完全被卡住了。
我想要的是一个文本框,用户在其中输入一个关键字(或多个单词),它为关键字运行 jquery 并为所有相关答案设置 display:block 。
我到目前为止是这样的:
<form name="searchBox">
Keyword(s): <input type="text" name="keyword" />
<input type="button" value="Search" onClick="searchFunction()" />
</form>
<div class="searchable" style="display:none">
This is the first software question and answer.</div>
<div class="searchable" style="display:none">
This is the first hardware question and answer.</div>
<script type="text/javascript">
function searchFunction() {
var searchTerm = document.searchBox.keyword.value;
$(" :contains('"+searchTerm+"')").addStyle("display:block"); }
</script>
尝试这个
function searchFunction() {
var searchTerm = document.searchBox.keyword.value;
$(".searchable").each(function(){
$(this).(":contains('"+searchTerm+"')").show();
});
}
尝试这个。
function searchFunction() {
$(".searchable")
.hide()
.filter(":contains('" + $("input[name='keyword']").val() + "')")
.show();
}
将.addStyle("display:block") 更改为.show()
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.