我目前正在嘗試使用三個選項進行選擇：-第一個是默認選項。-第二個選項顯示輸入，-第三個其他輸入
我的問題是：當我選擇第二個或第三個選項時，我的輸入會發生變化，所以這很好。但是當我選擇默認值時，我之前選擇的輸入不會消失。
有我的代碼片段：
$(document).ready(function() {
$('#bat').change(function() {
$($(this).children("option:selected").attr("data-hide")).hide();
$($(this).children("option:selected").attr("data-show")).show();
$($(this).children("option[value=1]").attr("data1")).hide();
$($(this).children("option[value=1]").attr("data2")).hide();
});
})<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="bat" name="card_name" class="form-select">
<option data1='#access' data2='#amount' value="1">--Veuillez choisir une option--</option>
<option data-hide='#access' data-show='#amount' value="A">Fichier separes : plusieurs fichiers de une page
</option>
<option data-hide='#amount' data-show='#access' value="B">Fichier multipages : 1 fichier de plusieurs pages
</option>
</select>
<div id="access">div 1</div>
<div id="amount">div 2</div>uj5u.com熱心網友回復：
您可以使用與以前相同的方法，并圍繞這兩個選項創建一個 div：
$(document).ready(function() {
$('#bat').change(function() {
$('#results').show()
$($(this).children("option:selected").attr("data-hide")).hide();
$($(this).children("option:selected").attr("data-show")).show();
});
})<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="bat" name="card_name" class="form-select">
<option data-hide='#results' data1='#access' data2='#amount' value="1">--Veuillez choisir une option--</option>
<option data-hide='#access' data-show='#amount' value="A">Fichier separes : plusieurs fichiers de une page
</option>
<option data-hide='#amount' data-show='#access' value="B">Fichier multipages : 1 fichier de plusieurs pages
</option>
</select>
<div id="results">
<div id="access" style="display:none;">div 1</div>
<div id="amount" style="display:none;">div 2</div>
</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/496544.html
標籤：javascript html jQuery css 表现