不工作IE8如果選項值選擇開關css

Question

我知道這可能是一個更好的方法，我嘗試了很多方法。我通常會做.hide()或.show()，但css顯示開關在FF上運行得更好，而不是在IE上。這裏是我的代碼

$(".VariationSelect option[value='21']").click(function() { 
    $("#21").css("display", "block"); 
}); 
$(".VariationSelect option[value!='21']").click(function() { 
    $("#21").css("display", "none"); 
}); 

我試着開關的情況下，如果和else但沒有任何工程

<div class="Value"> 
    <select name="variation[1]" class="VariationSelect" style="width: 180px;"> 
     <option value="">Choose a Ring Size</option> 
     <option value="6">6</option> 
    <option value="7">7</option> 
    <option value="21">Custom</option> 
    </select> 
</div> 
<div id="21" style="margin-left:20px; float:left; display:none"> 
    <div class="Label" style="margin-top:5px; "> 
     Custom Size:&nbsp;&nbsp; 
    </div> 
</div> 

Answer 1

是當你點擊IE瀏覽器中的「選項」之稱的點擊功能？我的猜測是點擊事件不會觸發IE中的選項元素。在選擇上改變（..）並測試該值。

下面是代碼：

$(".VariationSelect").change(function() { 
    if ($(this).val() == "21") { 
     $("#21").css("display", "block"); 
    } else { 
     $("#21").css("display", "none"); 
    } 
}); 

Answer 2

首先，我不建議使用ID和類，以數字開頭。

jQuery的

$(".VariationSelect").change(function() { 
    if ($(this).val() == '21') { 
     $("#cont_21").show(); 
    } else { 
     $("#cont_21").hide(); 
    } 
}); 

HTML

<div id="cont_21" style="margin-left:20px; float:left; display:none"> 
    <div class="Label" style="margin-top:5px; "> 
     Custom Size:&nbsp;&nbsp; 
    </div> 
</div> 

JSFiddle Demo here。

希望這會有所幫助！