jquery – 当图例元素点击时,将会将其缩小

$('legend.togvis').click(function() {
    $(this).siblings().toggle();
    return false;
});

除非fieldset包含文本节点,否则它的效果非常好.

<fieldset><legend class='togvis'>Click Me</legend>
  <p>I toggle when the legend is clicked.</p>
  But I'm a recalcitrant text node and refuse to toggle.
</fieldset>

为了切换文本节点,我也尝试过：

$('legend.togvis').click(function() {
    $(this).parent().contents().not('legend').toggle();
    return false;
});

它与第一个功能相同.和这个：

$('legend.togvis').click(function() {
    $(this).parent().contents(":not(legend)").toggle();
    return false;
});

这会抛出错误

message: 'style.display' is null or not an object
Line: 5557
Char: 3
Code: 0
URI: http://code.jquery.com/jquery-1.4.4.js

关于如何获取字段集(减去图例)的全部内容以在点击图例时切换的任何想法？

ETA解决方案,非常感谢Eibx

$('legend.togvis').click(function() { 
    $(this).parent().contents().filter(
        function() {  return this.nodeType == 3; }).wrap('<span></span>');//wrap any stray text nodes
    $(this).siblings().toggle(); 
});

解决方法

$("fieldset legend").click(function() {
  if ($(this).parent().children().length == 2)
    $(this).parent().find("div").toggle();
  else
  {
    $(this).parent().wrapInner("<div>");
    $(this).appendTo($(this).parent().parent());
    $(this).parent().find("div").toggle();
  }
});