jQuery/JS - DIV中的计数结果
我对JS很不在行，所以别紧张。
我有一个简单的搜索表单，它搜索整个身体，并在单击函数之后突出显示搜索词。效果很好。但是，我想添加这个函数来返回找到的结果的数量(除了就地突出显示函数)。编辑:此外，结果没有显示在页面上，它们只被JS脚本通过设计高亮显示。所以，本质上，我只需要一种方法来显示搜索后突出显示的结果的数量。
我所能找到的就是如何处理表中的数据。但是，我的数据不在表中。
此外，这不能是一个“现场”搜索，我需要它只有在点击事件被触发后才会触发。
我能找到的最接近的解决方案是HERE，但是，这是一个表中的实时搜索。
到目前为止，这是我的表格：
$('document').ready(function() {
$('#button').click(function() {
var searchbox = document.querySelector('#text-search');
var searchForm = document.querySelector('#search');
});
});
function highlight() {
var text = document.getElementById("text-search").value;
var query = new RegExp("(\\b" + text + "\\b)", "gim");
var e = document.getElementById("body").innerHTML;
var enew = e.replace(/(<span>|<\/span>)/igm, "");
document.getElementById("body").innerHTML = enew;
var newe = enew.replace(query, "<span>$1</span>");
document.getElementById("body").innerHTML = newe;
color = "#f6f";
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<body>
<div id="search" class="Column">
<form id="searchForm" method="post" action="" onsubmit="highlight(); return false;">
<input name="text-search" id="text-search" type="text" value="" class="input" placeholder="search & highlight">
<input id="submit" type="submit" value="Submit" class="button" />
</form>
<div class="count">search results: </div>
</div>
<div class="slide">
<div class="expand">
data
</div>
</div>
</body>
更新
由于一个JS向导帮助我解决了另一个问题，我几乎找到了一个解决方案。所以下面的代码是计算结果的数量，但是，它为页面上的每个DIV添加+1，即使搜索的术语在该DIV中不存在。所以，如果我的身体看起来像下面的例子，并且我搜索了测试，结果是5(2个搜索项+3个DIVs)。
正文：
<div1>
test
</div>
<div2>
test
</div>
<div3>
hai
</div>联署材料：
function count() {
var count =
$("#body span").length;
$(".count").text(count);
};那么，我如何调整数字电视的数量？
回答 2
Stack Overflow用户
发布于 2017-12-16 21:12:30
答案：
function count() {
var count =
$("#body span").length;
$(".count").text(count);
$('.count').append(" occurance(s) of searched term");
};Stack Overflow用户
发布于 2017-12-08 14:02:02
您的代码似乎是在一个跨度内包装匹配。您可以添加一个类似于" match“的类，并计算类匹配的跨度，如下所示：
var matches= $('span.match').length;https://stackoverflow.com/questions/47715633
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号