Question

<div class="stateF">
    <p class='itemRightMenu'><a class='black' href=''> تهران</a><div class="stateF2">+</div></p>
    <div class="stateH">
        <p class='itemRightMenu'><a class='black' href=''>منطقه ۱ </a></p>
    </div>
</div>
<div class="stateF">
    <p class='itemRightMenu'><a class='black' href=''> کرج</a><div class="stateF2">+</div></p>
    <div class="stateH">
        <p class='itemRightMenu'><a class='black' href=''>منطقه ۲ </a></p>
    </div>
</div>

我希望在点击.stateH时显示stateF2，但stateH有1 stateF

$(".stateH").hide();

$(".stateF2").click(function () {
    $("???.stateH").show('fast');
});

Answer 1

您可以在同一stateH元素中隐藏stateF元素。

＆＃13;

$(".stateF2").click(function() {
  $(this).closest('.stateF').find('.stateH').show('fast');
});

＆＃13;

.stateH {
  display: none;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="stateF">
  <p class='itemRightMenu'><a class='black' href=''> تهران</a>
    <span class="stateF2">+</span>
  </p>
  <div class="stateH">
    <p class='itemRightMenu'><a class='black' href=''>منطقه ۱ </a></p>
  </div>
</div>
<div class="stateF">
  <p class='itemRightMenu'><a class='black' href=''> کرج</a>
    <span class="stateF2">+</span>
  </p>
  <div class="stateH">
    <p class='itemRightMenu'><a class='black' href=''>منطقه ۲ </a></p>
  </div>
</div>

＆＃13;

注意：div无法成为p元素的子级，因此请使用span。它还设置初始状态使用css规则

Answer 2

使用closest()和find()等方法。

$(".stateH").hide();

$(".stateF2").click(function () {
    $(this).closest('.stateF').find(".stateH").show('fast');
});

Answer 3

您可以尝试使用此代码，希望它可以为您解决

 $(".stateH").hide();


 $(".stateF2").click(function() {

    $(this).parent().next().show('fast');

 });

尝试这个，它将显示下一个兄弟，在你的情况下是stateH，我的错，我错过了，这将成功

用Jquery中的类选择这个parrent

3 个答案: