Question

朋友们，我想要切换<li>，但它无法正常工作我尝试了以下代码

<script>
$(document).ready(function(){          
    $('#fly').hide();
    $('li').click(function(){
        $("#fly").hide(500);
        $(this).siblings("#fly").toggle(500);
    })
})
</script>

HTML

<ul >
  <li>hi
  <div id="fly">i m here</div>
  </li>
   <li>hi
  <div id="fly">i m here</div>
  </li>
   <li>hi
  <div id="fly">i m here</div>
  </li>
   <li>hi
  <div id="fly">i m here</div>
  </li>
</ul>

请帮帮我

Answer 1

尽管你的身份证不好，但我认为，这正是你要找的：

$(document).ready(function(){
  $('#fly').hide();
  $('li').click(function(){
    $(this).hide(500);
    $(this).siblings().show(500);
  });
});

Answer 2

Fiddle

$('.fly').hide();
$('li').click(function() {
    $('.fly', this).toggle(500);
    $(this).siblings().find('.fly').hide();
});

HTML

<ul >
    <li>hi
        <div class="fly">i m here</div>
    </li>
    <li>hi
        <div class="fly">i m here</div>
    </li>
    <li>hi
        <div class="fly">i m here</div>
    </li>
    <li>hi
        <div class="fly">i m here</div>
    </li>
</ul>

Answer 3

<script>

$(document).ready(function(){

$('.fly').hide();

$('li').click(function(){

     $(".fly").hide(500);
     $(this).siblings(".fly").toggle(500);
})
})

</script>

HTML

<ul >
  <li>hi
  <div class="fly">i m here</div>
  </li>
   <li>hi
  <div class="fly">i m here</div>
  </li>
   <li>hi
  <div class="fly">i m here</div>
  </li>
   <li>hi
  <div class="fly">i m here</div>
  </li>
</ul>

toggle（）不与li一起工作

3 个答案: