javascript - 如何修复“删除突出显示不是功能”?
问题描述
我指的是这个链接。我想找到页面上所有输入到文本框中的单词并突出显示它。我根据链接进行了操作,但在控制台中出现错误。
未捕获的类型错误:$(...).removeHighlight 不是函数
我在网络选项卡中看到jquery.min.js和jquery.highlight.js加载200状态。以下是我的代码,谢谢
Search: <input type="text" id="text-search" />
<div id="inputText1">
<p><b>Demo </b> he new edition of KnowlEdge K1 enables your school with flexibility by wholly automating their administrative and academic processes.</p>
@Html.ActionLink("Form User ", "Index", "User", null, new { @class = "btn btn-primary" }) //button
@Html.ActionLink("Form Role", "Index", "Role", null, new { @class = "btn btn-primary" }) //button
<div>
javascript:
<script src="~/Scripts/jquery-1.12.4.min.js"></script>
<script src="~/Scripts/jquery.highlight.js"></script>
<script type="text/javascript">
$(function () {
$('#text-search').bind('keyup change', function (ev) {
// pull in the new value
var searchTerm = $(this).val();
// remove any old highlighted terms
$('#inputText1').removeHighlight();
// disable highlighting if empty
if (searchTerm) {
// highlight the new term
$('#inputText1').highlight(searchTerm);
}
});
});
</script>
jQuery.highlight.js
jQuery.fn.highlight = function (pat) {
function innerHighlight(node, pat) {
var skip = 0;
if (node.nodeType == 3) {
var pos = node.data.toUpperCase().indexOf(pat);
if (pos >= 0) {
var spannode = document.createElement('span');
spannode.className = 'highlight';
var middlebit = node.splitText(pos);
var endbit = middlebit.splitText(pat.length);
var middleclone = middlebit.cloneNode(true);
spannode.appendChild(middleclone);
middlebit.parentNode.replaceChild(spannode, middlebit);
skip = 1;
}
}
else if (node.nodeType == 1 && node.childNodes && !/(script|style)/i.test(node.tagName)) {
for (var i = 0; i < node.childNodes.length; ++i) {
i += innerHighlight(node.childNodes[i], pat);
}
}
return skip;
}
return this.each(function () {
innerHighlight(this, pat.toUpperCase());
});
};
jQuery.fn.removeHighlight = function () {
function newNormalize(node) {
for (var i = 0, children = node.childNodes, nodeCount = children.length; i < nodeCount; i++) {
var child = children[i];
if (child.nodeType == 1) {
newNormalize(child);
continue;
}
if (child.nodeType != 3) { continue; }
var next = child.nextSibling;
if (next == null || next.nodeType != 3) { continue; }
var combined_text = child.nodeValue + next.nodeValue;
new_node = node.ownerDocument.createTextNode(combined_text);
node.insertBefore(new_node, child);
node.removeChild(child);
node.removeChild(next);
i--;
nodeCount--;
}
}
return this.find("span.highlight").each(function () {
var thisParent = this.parentNode;
thisParent.replaceChild(this.firstChild, this);
newNormalize(thisParent);
}).end();
};
解决方案
推荐阅读
- java - 如何从 Textview 在 getText() 中添加预定义的文本并显示结果
- java - 许多线程访问的地图上的准确数据
- android - 此应用无权在发布版本中使用 Firebase 身份验证
- python - Python用它的eval替换括号内的文本
- ios - 无法为签名者“iPhone Developer”建立自签名根的链
- python - 美汤:刮表数据
- javascript - 带有 getElementsByClassName 的 Javascript 执行引擎
- asp.net - Asp.Net Core 路由参数始终为 0 或 null
- python - Python Google Cloud Function Connection 由对等方重置
- javascript - 特快专递所有路线