根據數據屬性顯示/隱藏div

Question

我想使用數據屬性而不是數值來顯示/隱藏div。在這個例子中http://jsfiddle.net/copperlocks/nebY8/8/，我將如何在jQuery中做這件事？

<select id="test" name="test"> 
    <option value="" data-id="">Select</option> 
    <option value="1" data-id="a">Option 1</option> 
    <option value="2" data-id="b">Option 2</option> 
    <option value="3" data-id="c">Option 3</option> 
    <option value="4" data-id="d">Option 4</option> 
    <option value="5" data-id="e">Option 5</option> 
</select> 

<div id="something">Show Something</div> 

對於價值...

$(document).ready(function() { 
    toggleFields(); 
    $("#test").change(function() { 
     toggleFields(); }); 
}); 

function toggleFields() { 
    if ($("#test").val() > 2) $("#something").show(); 
    else $("#something").hide(); 
} 

我試過以下，但它似乎沒有工作...

if ($("#test").data('id') == "a") 

if ($("#test").attr('data-id') =="a") 

我是新來的這並會感謝您的幫助:)謝謝

Answer 1

數據屬性附加到該選項，因此檢查選定的選項將是方式去

if ($("#test option:selected").data('id') == "a") 

FIDDLE