我有一個帶有兩個選項的 html 選項選擇:
<select name="subject" id="subject">
<option value="option1">Option 1</option>
<option value="option2">Option 2</option>
</select>
我還有一個 id="human-genome" 的 div 元素。
<div id="human-genome"></div>
我想在默認情況下隱藏此 ID,并且在選擇選項 1 時。我想在選擇選項 2 時顯示此 ID。
這是我的jQuery:
$(document).ready(function(){
$("#subject").change(function(){
if($(this.val() == 'option1'){
$('#human-genome').hide();
} else {
$('#human-genome').show();
});
});
由于某種原因,代碼不起作用。有什么建議?先感謝您!
uj5u.com熱心網友回復:
您開發的代碼中存在語法錯誤。我按如下方式編輯了代碼以使其易于理解。

$(document).ready(function(){
$("#subject").change(function(){
console.log(this.value);
if(this.value == 'option1')
{
$('#human-genome').hide();
}
else
{
$('#human-genome').show();
}
});
});
#human-genome{
margin-left: 100px;
background-color: red;
width: 100px;
display: none;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="subject" id="subject">
<option value="option1">Hide</option>
<option value="option2">Show</option>
</select>
<div id="human-genome">TEST</div>
uj5u.com熱心網友回復:
我剛剛注意到一個語法錯誤。
uj5u.com熱心網友回復:
請嘗試使用 $(this).val() 而不是您的代碼。
$(document).ready(function(){
$("#subject").change(function(){
if($(this).val() == 'option1'){
$('#human-genome').hide();
} else {
$('#human-genome').show();
}});});
轉載請註明出處,本文鏈接:https://www.uj5u.com/net/407057.html
標籤:
上一篇:jQuery例子不能理解attr和split以及classNames[1]的作用
下一篇:頁面多載功能和初始化后的一些功能
