1

我对 jQuery 的了解有限...当单击两个触发器之一时，我需要有关要切换的单个 div 的特定实例的帮助。现在的问题是，如果使用一个触发器，您必须单击两次才能使另一个触发器工作。

这是我的 jQuery：

jQuery(document).ready(function($) {

    jQuery(".move").toggle(function(){
        jQuery(".contact-container").slideDown('fast'); 
    }, function () {
        jQuery(".contact-container").slideUp('fast');
});

});

我的 HTML 大致是这样的：

<div class="contact-container"></div>
<ul>
    <li class="trigger"></li>
</ul>
<a class="trigger"></a>

如果你想在开发网站上看到这个，你可以在这里查看（触发是右上角的“联系”按钮和页脚中的“联系”链接）：网站链接

4

2 回答 2

2

不确定我是否得到问题，并且我无意通过您的 wordpress 网站查看代码，但请尝试：

$(document).ready(function() {
    $(".move").on('click', function(){
        $(".contact-container").slideToggle('fast'); 
    });
});

如果两个触发元素都具有类“.move”，则应该可以正常工作，否则只需将该类添加到两个触发元素！

它现在不起作用的原因是切换功能使用“.move”类跟踪两个不同元素的状态，但不知道滑动的“.contact-container”元素是否可见。改用 slideToggle 可以解决这个问题。

于 2012-07-19T22:19:41.190 回答
0

首先，小提琴。

您可以使用 jQuery 的.toggle()方法来执行此操作。它将根据需要自动显示或隐藏元素。

您还可以click按类而不是按特定 ID 设置处理程序。这样，只要具有该类的任何元素（在下面的示例中，我使用toggle-button了 ），它将调用单击处理程序函数。

更新：我更改了我的示例以匹配您在上面发布的示例代码。

<ul>
    <li class="trigger">Trigger 1</li>
</ul>
<a class="trigger">Trigger 2</a>

<div style="height: 400px; width: 400px; background-color:red;" class="contact-container"></div>

​</p> 

$(document).ready(function() {
    $('.trigger').on('click', function(e) {
       e.preventDefault();
        $('.contact-container').slideToggle('fast');
    });
});​
于 2012-07-19T22:21:02.323 回答