搜索和刪除的兄弟姐妹時，搜索結果中發現

我想添加一個搜索過濾器，使用戶能夠找到合同的這個名單，而他們正在打字的結果。例如：如果用戶鍵入「IP」，則應顯示前4個結果。以下是該函數：

$('#doc_search').on('keyup', function(){ 

    var inputtext = $(this).val().toLowerCase(); 

    $('.subdoclist li a').each(function() { 
     if(inputtext ==''){ 
      $('.subdoclist li').each(function(){ 
       $(this).addClass('show'); 
      }); 
      console.log(inputtext); 
     } else if ($(this).text().toLowerCase() === inputtext) { 

      $('.subdoclist li').removeClass('show'); 
      $(this).parent().addClass('show'); 
      console.log(inputtext); 
     } 

    }); 
})

「#doc_search」在頂部
「.subdoclist禮」是包含文本

錨標籤在列表項的搜索欄一刻，我必須鍵入確切的文字，然後才能搜索。

小提琴鏈接：Click here

來源

2015-12-14 AnAspiringCanadian

我切換邏輯張望了一下這裏：http://jsfiddle.net/n1wxkhkp/ - 如果沒有輸入，顯示所有的事情，否則顯示每個包含字符串的地方。 –

這就像一個魅力，你做了所有的工作哈哈。如果你是我的同事，我會給你買一瓶啤酒，謝謝你。發佈這個答案，我會檢查它作爲答案。 – AnAspiringCanadian

這是一對夫婦的事情搞掂，首先我使用的indexOf> -1，看看如果輸入的字符串包含每一個潛在的比賽中，和，而不是對所有的人都卸下顯示每個比賽我在它執行搜索之前執行它。

$('#doc_search').on('keyup', function() { 
    var inputtext = $(this).val().toLowerCase(); 
    if (inputtext != '') { 
    $('.subdoclist li').removeClass('show'); 
    $('.subdoclist li a').each(function() { 
     if ($(this).text().toLowerCase().indexOf(inputtext) > -1) { 
     $(this).parent().addClass('show'); 
    } 
     }); 
    } else { 
    $('.subdoclist li').addClass('show'); 
    } 
});

來源

2015-12-14 20:52:49

如果你想要一個簡單的搜索，你可以檢查，如果輸入的文本包含的字符串是這樣的： How to check whether a string contains a substring in JavaScript?

您可以檢查在搜索中輸入的每個單詞，使用空格分隔符分割字符串並使用循環，但如果輸入的內容太多或太多，則需要付出更多努力。

來源

2015-12-14 20:28:20 Gonzalo

我更新了小提琴：http://jsfiddle.net/9tmg5osg/2/ 但它似乎需要將不能正常工作。它只搜索一個項目。 – AnAspiringCanadian

看到我的小提琴，每次你做一場比賽，你都會從所有的李子中刪除秀。 –

短期和大小寫敏感的變體：

$('#doc_search').on('keyup', function() { 
    var inputtext = $(this).val(); 
    if (inputtext !== '') { 
     $('.subdoclist li').each(function() { 
     $(this).toggle($("a:contains('"+ inputtext +"')",$(this)).length > 0); 
     }); 
    } else { 
    $('.subdoclist li').show(); 
    } 
});

來源

2015-12-14 20:56:04 RomanPerekhrest

我不想要任何敏感的東西，我通過亞當得到了答案，我仍然很感激您的意見。 – AnAspiringCanadian

謝謝！我只是想展示一些「短」的東西 – RomanPerekhrest

搜索和刪除的兄弟姐妹時，搜索結果中發現

回答

相關問題