Question

请帮我解决这个问题......

<li id="4331">Region
      <ul>
         <li id="4332">Asia</li>
         <li id="6621">Europe</li>
      </ul>
</li>

如果我点击区域
，这是我的查询它是ul的父母只显示亚洲和单击欧洲并隐藏区域（父级）

i am using the .hide() method

这是我到目前为止所做的：

$(document).ready(function() {
    $("li").live("click", function(event) {
        $("li").hide(); 
        event.cancelBubble = true;
        loadChild($(this).attr("id"), event);
        return false;
    })
});

我目前的输出是：

<li id="4331" style="display: none;">
Region
   <ul>
      <li id="4332">Asia</li>
      <li id="6621">Europe</li>
   </ul>
</li>

隐藏一切......

但我想只隐藏父区域
我希望能够点击它隐藏地区并仅显示亚洲和欧洲请帮我解决这个问题感谢。

Answer 1

$("li")是您网页上所有li元素的集合，而不仅仅是您点击的元素。

替换

$("li").hide();

与

$(this).parent().closest("li").hide();

Answer 2

我认为您要隐藏文字Region，因此您可以将其粘贴在<span>标记中并隐藏它。

<li id="4331"><span id="region_text">Region</span>
  <ul>
    <li id="4332">Asia</li>
    <li id="6621">Europe</li>
  </ul>
</li>

然后你可以使用

$("#region_text").hide();

请注意，我不了解jQuery，但我对HTML和DOM有所了解：）

Answer 3

你需要更改DOM，文本“Region”不是ul的父级，而是兄弟

<li id="4331">
      <span class="region">Region</span>
      <ul>
         <li id="4332">Asia</li>
         <li id="6621">Europe</li>
      </ul>
</li>

jquery（不赞成使用，使用'on'）

$(document).ready(function() {
    $("li").on("click", function(event) {
        $(this).find('.region').hide(); 
        loadChild($(this).attr("id"), event);
        return false;
    })
});

Answer 4

我发现this answer非常有用：

$('#4331').css('position','relative').css('left','-9999px');

$('#4331>ul').css('position','relative').css('left','9999px')

隐藏孩子的父母而不是孩子

4 个答案: