JQuery - 切换效果不起作用

它正确切换，但没有效果。效果是否只显示div？这里是我的代码：

$(".toggler").click(function(event) { 
 
    var clickedElement = $(event.target); 
 
    $(clickedElement).parent().parent().next("tr").find("td").toggle("slow", 1000); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<td class="details" style="display: none;" colspan="6"> 
 
    <p>This is an example column...</p> 
 
    <p>This is an example column...</p> 
 
</td> 
 

 

 
<table class="table table-responsive"> 
 
    <tbody> 
 
    <tr> 
 
     <th><a class="toggler">First</a></th> 
 
     <th><a class="toggler">Second</a></th> 
 
     <th><a class="toggler">Third</a></th> 
 
    </tr> 
 
    </tbody> 
 
</table>

由于提前

来源

2017-09-23 OhMad

HTML中的'toggler'在哪里？ –

它在表格“th” - 标签内。但是，就像我刚才提到的那样，切换本身正在发挥作用。 – OhMad

这是什么元素'$（“。toggler”）'？粘贴完整的html代码。 –

p jQuery toggle()的参数是speed，easing和callback。你试图在第一个参数和第二个参数中传递速度。它应该是toggle(1000);或toggle("slow");。

来源

2017-09-23 16:38:22 Fuross

您可以使用jQuery UI延长切换效果选项：https://jqueryui.com/toggle/

对于一个简单的褪色，请尝试使用.fadeToggle （）它包含在基本jQuery库中：http://api.jquery.com/fadetoggle/

来源

2017-09-23 16:31:29 IzzyCooper

噢，我的错误是，我从bootstrap cdn中使用了一个精简版本的JQuery。

通过使用正常的修复它。

来源

2017-09-23 16:38:36 OhMad

您应该将答案标记为已接受，所以人们知道你已经知道了。这可能是你自己的。 – IzzyCooper

JQuery - 切换效果不起作用

回答

相关问题