jQuery HTML选择切换/显示/隐藏

时间:2010-01-28 14:04:20

标签: jquery html xhtml

我需要隐藏“其他”标签和相应的输入字段作为默认值。然后,当用户从HTML选择下拉菜单中选择“其他”时,需要显示匹配的标签和文本输入。如果他们导航到其他选项,则标签和文本输入将再次隐藏:

HTML:

    <select id="indTitle" class="inlineSpace">
        <option value="Please select">Please select...</option>
        <option value="Mr">Mr</option>
        <option value="Mrs">Mrs</option>
        <option value="Ms">Ms</option>
        <option value="Miss">Miss</option>
        <option value="Dr">Dr</option>
        <option value="Other">Other</option>
    </select>
    <label for="indOther" class="inlineSpace">Other</label>
    <input type="text" class="text" name="indOther" id="indOther" maxlength="20" />

1 个答案:

答案 0 :(得分:3)

$('#indTitle').change(function() {
    if($(this).val() == 'Other') {
        $('label[for=indOther], #indOther').show();
    } else {
        $('label[for=indOther], #indOther').hide();
    }
});