選中複選框時顯示另一選項

選中複選框時，我無法顯示「T恤」尺寸。我正在使用jQuery，但我無法讓代碼正常工作。這是我到目前爲止的代碼：選中複選框時顯示另一選項

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $('#tshirt').attr('checked'); 
     $("#sizes").show(); 
    }); 
); 
</script> 


<b>Cool T-Shirt</b>: <input type="checkbox" id="tshirt" name="tshirt"> <span class="price">$15</span>    
<span id="sizes"><bSize</b>: <input type="checkbox" name="size" value="S"> <span class="price">Small</span></span>

目前ID「大小」設置爲顯示：通過CSS無。我需要幫助的是，當用戶選擇ID爲「tshirt」的複選框時，我想顯示ID「大小」。任何幫助是極大的讚賞！

來源

2012-04-04 three3

你需要把你的代碼click()處理器中，像這樣：

$(document).ready(function() { 
    $('input#tshirt').click(function() { 
     if($(this).is(':checked')) { 
      $("#sizes").show(); 
     } else { 
      $("#sizes").hide(); 
     } 
    }); 
});

這將顯示#sizes當複選框被選中，並會再次隱藏它們時，它的未覈對。

目前尚不清楚爲什麼您的當前JS中有$('#tshirt').attr('checked');，因爲您只需將checked="checked"添加到您的<input>以使其在頁面加載時進行檢查。

來源

2012-04-04 00:34:22 Bojangles

.toggle（）應該照顧它。像這樣的東西..

$('#tshirt').click(function() { 
$('#sizes').toggle('slow', function() {

'慢'你可以用'快'和其他參數替換。

來源

2012-04-04 00:34:25 Ray

這是可行的，但它是更好地檢查是否複選框的國家和行爲的基礎上，另一塊JS可以改變檢查狀態，然後你會得到逆行。 – Bojangles 2012-04-04 02:07:20

你應該能夠做這樣的事情：

$(document).ready(function() { 
    $("#tshirt").change(function() { 
     if($(this).is(":checked")) { 
      $("#sizes").show(); 
     } else { 
      $("#sizes").hide();    
     } 
    }); 
});

然後只需確保在默認情況下隱藏的CSS：

#sizes { 
    display: none; 
}

來源

2012-04-04 00:36:30 wows

選中複選框時顯示另一選項

回答

相關問題