A brief analysis of the realization of page content search based on WEB front end pages
- 2020-03-30 03:19:29
- OfStack
This is what web pages do before they are searched
The form gets the keyword w> Pass back end SQL statement processing. The data is returned to the front end for display
Today all of a sudden to the browser's Ctrl+F this function how to achieve, put the data once on the page, and then in JS to match the content of the page.
Anyway, now that we're done, we're optimizing, right
$(function(){
var UserArray = new Array();
var TurenameArray = new Array();
var table = $("table>tbody");
table.children().each(function(){
userid = $(this).children().eq(0).html();
//Store the student number in the output
UserArray.push(userid);
turename = $(this).children().eq(1).html();
//Store the name in the array
TurenameArray.push(turename);
});
//
$("#search").focus(function(){
$(this).val("");
}).blur(function(){
val = $.trim($(this).val());
if(val === "")
{
$(this).val(" Work number / The name ");
}
});
$(".btn").click(function(){
val = $("#search").val();
if(val === " Work number / The name ")
{
alert(" Please enter a valid job number and name ");
}
else
{
table.children().hide("100");
if(!isNaN(val))
{
hanld(UserArray,val);
}
else
{
hanld(TurenameArray,val);
}
}
});
function hanld(array,value)
{
for(i=0;i<array.length;i++)
{
if(array[i].indexOf(value) !== -1)
{
table.children().eq(i).show("1000");
}
}
}
The code is up here, and I'm going to talk about the design ideas.
Get the data to match the combination in order into the array, and then in the match.
Indexof, a function that USES the substring of JS to locate, returns -1 if it does not match, and a match returns the position of the string.
This completes the search. All the data is hidden, and then the match is shown. That's OK