javascript - 使用 JQuery 定位隐藏字段

Question

归结为最简单的元素，我只想在单击页面上的元素时设置隐藏字段的值。

HTML:

<div id="toggleParent">
  <input type="hidden" name="toggleValue" id="toggleValue" value="closed" />
  <h2>Click Me</h2>
</div>

jQuery:

jQuery(document).ready(function() {
  var toggle;
  jQuery('div#toggleParent h2').click(function () {
    if (toggle == '' || toggle == 'open') {
      toggle = 'closed';
    } else {
      toggle = 'open';
    }
    jQuery('div#toggleParent input#toggleValue').val(toggle);
  });
});

显然，它不起作用。 (否则我为什么会在这里？)点击事件工作正常，因为我可以在 Firebug 中单步执行它。但是当开始设置该值时，代码失败了。更重要的是，尝试 alert(jQuery('div#toggleParent input#toggleValue').length) 返回 0。事实上， alert(jQuery('div#toggleParent h2').length) 返回 0，即使该元素上的单击事件刚刚触发!

我错过了什么？

Answer 1

这个:

document.ready(function () {...});

应该是:

jQuery(document).ready(function () {...});

或者甚至:

jQuery(function () {...});

或者...

jQuery(function ($) { /* Use $ in here instead of jQuery */ });

请记住，使用 ID 时，不需要任何其他选择器，因为 ID 是唯一的。这就足够了:

jQuery('#toggleValue').val(toggle);