为什么搜索文本隐藏在jquery中的标题后面?

时间:2013-08-02 12:42:21

标签: jquery jquery-mobile

enter image description here

我正在使用div搜索文本。实际上我的搜索文本隐藏在标题后面。

请采取以下步骤:

  1. 单击标题的第四个按钮。搜索字段显示输入“India”
  2. 然后按搜索按钮(最少10次)。经过搜索文本搜索很少的搜索后面是标题。
  3. 我展示了它的图像。如果您向上和向下滚动,则可以看到搜索匹配。
  4. 这是我的代码

    http://jsfiddle.net/ravi1989/q2HxP/2/

    var searchIndex = -1;
    var searchTermOld ='';
    
    $(document).ready(function(){
      $('.searchbox').on('change',function(){
        if($(this).val()===''){
          var  selector= "#realTimeContents";
         $(selector+' span.match').each(function(){
            $(this).replaceWith($(this).html());
          });
        }
          searchIndex = -1;
          $('.searchNext').attr("disabled", "disabled");
          $('.searchPrev').attr("disabled", "disabled");
        searchTermOld = $(this).val();
      });
      $('.searchbox').on('keyup',function(){
    
        var  selector= "#realTimeContents";
        if($(this).val()===''){
         $(selector+' span.match').each(function(){
            $(this).replaceWith($(this).html());
          });
        }
        if($(this).val() !== searchTermOld){
         $(selector+' span.match').each(function(){
            $(this).replaceWith($(this).html());
          });
          searchIndex = -1;
          $('.searchNext').attr("disabled", "disabled");
          $('.searchPrev').attr("disabled", "disabled");                              
      }
      });
      $('.search').on('click',function(){
    
    
        if(searchIndex == -1){
          var searchTerm = $('.searchbox').val();
          if(searchTerm==''){
             PG_alert("Please Insert Text.")
            return ;
          }
          searchAndHighlight(searchTerm);
        }
        else searchNext();
        if($('.match').length >1){
          $('.searchNext').removeAttr("disabled");
          $('.searchPrev').removeAttr("disabled");
        }
      });
    
      $('.searchNext').on('click',searchNext);
    
      $('.searchPrev').on('click',searchPrev);
    });
    
    function searchAndHighlight(searchTerm) {
        if (searchTerm) {
            var searchTermRegEx, matches;
            var  selector= "#realTimeContents";
            $(selector+' span.match').each(function(){
            $(this).replaceWith($(this).html());
          });
            try {
                searchTermRegEx = new RegExp('('+searchTerm+')', "ig");
            } catch (e) {
                return false;
            }
            $('.highlighted').removeClass('highlighted');
            matches = $(selector).text().match(searchTermRegEx);
                    if (matches !==null && matches.length > 0) {
                var txt = $(selector).html().replace(searchTermRegEx, '<span class="match">$1</span>');
                $(selector).html(txt);
                searchIndex++;
               $('.match:first').addClass('highlighted');
             if($('.match').eq(searchIndex).offset().top > $(window).height()-15){
      $(document).scrollTop($('.match').eq(searchIndex).offset().top)+500;
    }
              return true;
            }else{
              PG_alert('Search not found.');
            }
          return false;
        }
      return false;
    }
    
    function searchNext(){
      searchIndex++;
      if (searchIndex >= $('.match').length) searchIndex = 0;
      $('.highlighted').removeClass('highlighted');
      $('.match').eq(searchIndex).addClass('highlighted');
    if($('.match').eq(searchIndex).offset().top > $(window).height()-10){
      $(document).scrollTop($('.match').eq(searchIndex).offset().top)+500;
    }
    }
    
    function searchPrev(){
      searchIndex--;
      if (searchIndex < 0) searchIndex = $('.match').length - 1;
      $('.highlighted').removeClass('highlighted');
      $('.match').eq(searchIndex).addClass('highlighted');
     if($('.match').eq(searchIndex).offset().top > $(window).height()-10){
      $(document).scrollTop($('.match').eq(searchIndex).offset().top);
    }
    }
    
    $(document).on('click', '.search_h', function() {
      //$( "#searchPopupScreen" ).popup( "open" )
       window.scrollTo(0,0);
      $(".searchbox").val('');
        $("#realTimeContents").css("height", "");
    
       $(".highlighted").removeClass("highlighted").removeClass("match");
         // $('.searchbox').focus();
    $("input[type=range]").val(60).slider("refresh");
       $(".searchContend_h").toggle("slow");
    });
    
    $(document).on('click', '.follow_h', function() {
    
     window.scrollTo(0, document.body.scrollHeight);
    
    
    });
    

    此问题的任何更新?

0 个答案:

没有答案