2010-01-28 169 views
0

我需要隐藏“其他”标签和相应的输入字段作为默认值。然后,当用户从HTML选择下拉列表中选择“其他”时,需要显示匹配的标签和文本输入。如果他们浏览到一个不同的选项,然后在标签和文本输入框被再次隐藏:jQuery 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" /> 

回答

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

嗨。为此欢呼。我必须设置默认隐藏以及加入: $('label [for = indOther],#indOther')。hide(); 改变事件之前 – RyanP13 2010-01-28 14:16:57

+0

啊,是的。如果它是默认隐藏的,尽管(这是有道理的),我会考虑通过向两个元素内嵌'style =“display:none;”'手动隐藏它,否则它们可能在执行脚本之前短暂可见。 – 2010-01-28 15:02:14

+0

我将不得不适应JavaScript被禁用,所以如果我手动添加用户将永远不能输入其他文本,如果他们选择其他作为他们的标题。 不要误解我真的很感谢帮助仍:) – RyanP13 2010-01-28 21:36:02