如何仅在选中复选框时显示输入字段？

基本上，我只想在选中复选框时显示这些字段，如果未选中该字段，则消失。

<input type="checkbox" name="supplied" value="supplied" class="aboveage2" />

<ul id="date">
    <li><input id="start" name="start" size="5" type="text" class="small" value="1" /></li>
    <li><input id="end" name="end" size="5" type="text" class="small" value="2" /></li>
</ul>

我尝试过类似的事情：

$('#supplied').live('change', function(){
     if ( $(this).val() === 'supplied' ) {
         $('.date').show();
     } else {
         $('.date').hide();
     }
 });

任何建议将不胜感激=）

“#foo”选择器查找其元素id值是“foo”，而不是“name”。因此，您需要做的第一件事就是向复选框添加“id”属性。

第二件需要担心的事情是，在 IE 中（至少是旧版本），直到复选框元素失去焦点时才会触发“change”事件。最好处理“点击”，而你要检查的是元素的“checked”属性。

我会写的是这样的：

$('#supplied').click(function() {
  $('.date')[this.checked ? "show" : "hide"]();
});