如何使用文本框的值

我有一個文本框和多重選擇框來過濾多選擇值。當我在文本框中寫入內容時，它將過濾多個選擇中的文本並僅顯示匹配的值。如何使用文本框的值

<!DOCTYPE html> 
<html> 

<body> 
    <select id="uniqueCarNames" name="cars" multiple> 
     <option value="volvo">Long Distance Travel</option> 
     <option value="saab">Amazing </option> 
     <option value="opel">Excellent Travelling</option> 
     <option value="audi">I am rich</option> 
    </select> 
    <input type="text" id="filterMultipleSelection" /> 
</body> 

</html>

所以，如果我開始在輸入框中書寫，它將開始篩選選擇框中的值。我想要使用選項標籤的文本進行過濾。請指導。

來源

2015-06-16 s_k_t

的.filter(function) jQuery的方法可以被用來找到目標選項元素，並將其顯示如下。 JavaScript方法.toLowerCase()是用來做搜索case-insensitive：

$('#filterMultipleSelection').on('input', function() { 
 
    var val = this.value.toLowerCase(); 
 
    $('#uniqueCarNames > option').hide() 
 
    .filter(function() { 
 
     return this.value.toLowerCase().indexOf(val) > -1; 
 
    }) 
 
    .show(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
    <select id="uniqueCarNames" name="cars" multiple> 
 
     <option value="volvo">Volvo</option> 
 
     <option value="saab">Saab</option> 
 
     <option value="opel">Opel</option> 
 
     <option value="audi">Audi</option> 
 
    </select> 
 
    <input type="text" id="filterMultipleSelection" />

來源

2015-06-16 23:18:33 PeterKA

我感謝的解決方案，我需要一個忙。在這裏，您使用選項值進行了過濾，如果我的值和選項標籤的文本不同，該怎麼辦？像，如何使用文本「Master Car」進行過濾。 –

我將.value改爲.text及其工作..這是我的錯誤。對不起:) –

使用return $（this）.text（）。toLower ...來代替。 – PeterKA

如何使用文本框的值

回答

相關問題