搜索和查询html代码,html查找框功能

html页面的查找功能主要是实现在查找框内输入字符，下面通过本文给大家分享html页面的查找功能，需要的朋友参考下吧

最近在搞一个被很多人改了的框架，天天看代码看的头的晕了，不过感觉进步还挺大的，自己做了一个后台可配置前台查看两个库不同数据范围的东西，还挺满意，那天拿出来分享一下，今天先说一个这几天做的功能，就是html页面的查找功能。

这个功能主要是实现在查找框内输入字符，之后按后面的上一个下一个按钮，会自动把查询区域内的匹配字符用特殊的样式标记，之后可以继续按上一个下一个按钮把按照顺序浏览匹配字符，并把当前匹配的字符用另一种样式与其他匹配字符加以区别。

前台显示大概是这个样子：

html是这样：

查找：

script代码：

var oldKey0 = "";

var index0 = -1;var oldCount0 = 0;

var newflag = 0;

var currentLength = 0;

function wordSearch(flg) {

var key = $("#key").val(); //取key值

if (!key) {

return; //key为空则退出

}

getArray();

focusNext(flg);

}

function focusNext(flg) {

if (