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


Related articles: