javascript - jQuery Toggle第二次无法正常工作

我试图每次onclick更改div的高度。根据第一次单击的内容给出固定的高度，然后根据第二次单击的默认高度/自动给出高度。但是以下代码仅在第一次切换时有效，当我再次单击它时不起作用，第二次未设置高度自动/默认值。谁能告诉我代码也有什么问题，在新的jQuery版本中，如何编写切换功能。如果我在较新的版本中编写切换功能，该按钮将消失。

 $('.item-inner .circle').toggle(function(){
		var itemHeight = $(this).parents('li').siblings('li').children('.item').height();
		$(this).parents('.item').addClass('active');
		$(this).parents('.item').height(itemHeight);
	}, function(){
		$(this).parents('.item').removeClass('active').delay(1000).queue(function() {
			$(this).height('');
		});
	});

ul, li {
   list-style: none;
 padding: 0;
  margin: 0;
 }

.circle {
    background: #c8d3d8;
    padding: 10px;
    display: inline-block;
    cursor: pointer;
  }
.item {
    border: 2px solid #c8c8c8;
    padding: 10px;
    margin-bottom: 10px;
  }
.item.active {
    background-color: #c4c4c4;
  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<ul>
  <li>
    <div class="item">
      <div class="item-inner">
        <p>Lorem ipsum dolor sit amet, nec ea modus graece scaevola, sed explicari vituperata ut. Possim oportere eu his, velit intellegam eos an, cum no discere perfecto. Et sed congue nominati. Sit vero dolorem invidunt ea, ius quis munere eu.</p>
        <span class="circle">click me</span>
       </div>
    </div>
   </li>
  <li>
    <div class="item">
      <div class="item-inner">
        <p>Lorem ipsum dolor sit amet, nec ea modus graece scaevola, sed explicari vituperata ut. Possim oportere eu his, velit intellegam eos an, cum no discere perfecto. Et sed congue nominati. Sit vero dolorem invidunt ea, ius quis munere eu.</p>
        <span class="circle">click me</span>
       </div>
    </div>
   </li>
  <li>
    <div class="item">
      <div class="item-inner">
        <p>Lorem ipsum dolor sit amet, nec ea modus graece scaevola, sed explicari vituperata ut. Possim oportere eu his, velit intellegam eos an, cum no discere perfecto. Et sed congue nominati. Sit vero dolorem invidunt ea, ius quis munere eu.</p>
        <span class="circle">click me</span>
       </div>
    </div>
   </li>
  <li>
    <div class="item">
      <div class="item-inner">
        <p>Lorem ipsum dolor sit amet, nec ea modus graece scaevola, sed explicari vituperata ut. Possim oportere eu his, velit intellegam eos an, cum no discere perfecto. Et sed congue nominati. Sit vero dolorem invidunt ea, ius quis munere eu.</p>
        <span class="circle">click me</span>
       </div>
    </div>
   </li>
</ul>

最佳答案

您似乎想在切换，更改高度时取消高度：

$(this).height('');

至

$(this).css('height','auto');

关于javascript - jQuery Toggle第二次无法正常工作，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/31981948/