jQuery-App輸入框實現實時搜索

1、實現實時搜索
其實原理就是很簡單，實時獲取輸入框的值即可，並且對不同情況操作進行不同處理。
2、

這裏只貼出主要事件語句代碼，具體一些操作要視具體情況而定

// 監聽搜索框的內容變化 實現實時搜索
    $(".searchContent").bind("input propertychange change", function () {
      studentName = $(".searchContent").val();
      var searchContent = $(".searchContent").val();
      if (searchContent.length > 0) {
        $(".clearSearchContent").removeClass("none");
        $(".clearSearchContent").on("click", function () {
          $(".searchContent").val("");
          studentName = $(".searchContent").val();
          pageIndex = 1;
          $(".clearSearchContent").addClass("none");
          $(".searchContent").focus();
        })
      }
    });
    // 搜索框失去焦點時 如果搜索框沒有內容則恢復搜索前狀況 如果有內容則搜索
    $(".searchContent").on("blur", function () {
      if ($(".searchContent").val().length == 0) {
        $(".searchContent").attr("placeholder", "搜索");
        $(".searchContent").css("background-image", "url(./res/png/magnify.png)");
        $(".cancelSearchBtn").addClass("none");
        $(".searchImg").addClass("none");
      } else {
        studentName = $(".searchContent").val();
       
    })
    //搜索框獲得焦點時，並且搜索框有內容的時候，出現打叉，打叉可以清空搜索框內容並加載全部請假單
    $(".searchContent").on("focus", function () {
      $(".searchContent").attr("placeholder", "");
      $(".searchContent").css("background-image", "");
      $(".searchImg").removeClass("none");
      var searchContent = $(".searchContent").val();
      if (searchContent.length > 0) {
        $(".clearSearchContent").removeClass("none");
        $(".clearSearchContent").on("click", function () {
          $(".searchContent").val("");
        });
      }
    });

    // 當滑動請假單列表時 輸入框失去焦點 則隱藏輸入鍵盤和填寫請假單的按鈕
    $(document).scroll(function () {
      if ($(".searchContent").is(":focus")) {
        $(".searchContent").blur();
      }
    });

    // 點擊手機鍵盤的搜索/開始按鈕進行搜索
    $(document).keydown(function (event) {
      if (event.keyCode == 84 || event.keyCode == 13) {
        studentName = $(".searchContent").val();
        pageIndex = 1;
        if (mineManagement) {
          inquireMyManageClassesList(pageIndex);
        } else {
          loadData(pageIndex);
        }
      }
    });

    // 點擊取消 情況搜索框的輸入內容 並加載全部請假單
    $(".cancelSearchBtn").on("click", function () {
      $(".searchContent").val("");
      $(".searchContent").attr("placeholder", "搜索");
      $(".searchContent").css("background-image", "url(./res/png/magnify.png)")
      $(".cancelSearchBtn").addClass("none");
      $(".searchImg").addClass("none");
      studentName = "";
     
    });

    // 點擊搜索圖標進行搜索
    $(".searchImg").on("click", function () {
      studentName = $(".searchContent").val();
      pageIndex = 1;
    
    });