我有一個如下所示的下拉選單:
<select name="category" id="category">
<option value="category-1">category-1</option>
<option value="category-2">category-3</option>
<option value="category-3">category-2</option>
</select>
<select name="product" id="product">
<option data-subtext="category-1">product</option>
<option data-subtext="category-1">product</option>
<option data-subtext="category-2">product</option>
<option data-subtext="category-2">product</option>
<option data-subtext="category-3">product</option>
<option data-subtext="category-3">product</option>
</select>
如何僅顯示匹配資料潛文本及其類別值的產品?
uj5u.com熱心網友回復:
您需要隱藏并根據所選值顯示它
$('select[name=category]').on('change', function (event) {
let selectedValue;
selectedValue = $(this).find('option:selected').text();
$('select[name=product] option').filter(function () {
if ($(this).attr('data-subtext') !== selectedValue) {
return true;
} else {
$(this).show();
this.selected = true;
}
}).hide()
});
轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/495079.html
標籤:javascript html jQuery
上一篇:如何使用正則運算式檢查重復的單詞
