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

根据数据属性显示/隐藏Div

1 个答案: