Jquery切换仅在元素开始可见时有效

Jquery toggle only works when element starts visible

本文关键字：有效 开始 元素 Jquery      更新时间：2023-09-26

我的网站上有一个幻灯片切换功能，以前工作得很好。现在（对我来说是出乎意料的）toggle函数只有在元素可见的情况下才起作用，在这两种情况下都很正常。以display none开头的块不再执行任何操作。如果我使用浏览器开发工具进行检查，我的脚本中没有任何错误。这里发生了什么？

http://venzo.co.nl/index.php?r=vacature/index

（点击加号/叉号切换）

有人能帮我吗？

编辑：javascript函数：

function toggle(target, kruis){
    $(target).slideToggle();
    if($(kruis).hasClass('heen') == false){
        $(kruis).addClass('heen');
        $(kruis).removeClass('terug');
    }else{
        $(kruis).addClass('terug');
        $(kruis).removeClass('heen');
    }
}

html调用函数：

<img src="handig/ikoons/plus2.png" 
            id="kruis5<?php echo $data->id;?>" 
            onclick="javascript:toggle('#vacatureUitklap<?php echo $data->id;?>', '#kruis5<?php echo $data->id;?>');" 
            class="uitklappen handje rotate <?php echo $heen;?>"/>

在CSS中，您已将重要规则添加到：

 .onzichtbaar {
     display: none !important;
 }

移除它，它就会工作！

 .onzichtbaar {
     display: none;
 }

JQuery

$(function () {
    $('.expander').live('click', function () {
        $('#TableData').slideToggle();
    });
});

HTML

<h3><img src="toggle.png" class ="expander" alt="Expand"/> 
</h3>
<div style="display:none" id="TableData">Text</div>
<p class="traversing"></p>

演示

使用此main.css行号44:

.onzichtbaar {
  display: none;
}

**而不是

.onzichtbaar {
  display: none !important;
}

这里不能用！重要的访问：http://prowpexpert.com

相关文章：