Question

我已经检查了一些其他线程，但似乎无法找到与我的代码一致的响应。我的问题是我的点击事件仅在第二次点击时触发，此时它完美运行（第二次点击打开，第三次点击关闭，第四次打开等等）

$('.expand-btn').click(function() {
      var clicks = $(this).data('clicks');
      if (clicks) {
        $('.expand-wrapper').animate({
            right: "0"
        }, 500, function() {

        });
      } else {
        $('.expand-wrapper').animate({
            right: "-325px"
        }, 500, function() {

        });
      }
      $(this).data('clicks', !clicks);
    });

编辑：这是我的HTML代码。它的工作方式类似于this jquery plugin，其中.expand-wrapper是隐藏在屏幕外的联系表单，.expand-btn是位于屏幕一侧且可点击的小翻盖。

<div class="expand-wrapper">
    <a href="#" class="expand-btn"><i class="fa fa-envelope-o" aria-hidden="true"></i> Contact</a>
    <div class="expand-form">
        <?php echo do_shortcode('[contact-form-7 id="2173" title="Home 01 Request_no_title"]'); ?>
    </div>
</div>

Answer 1

这听起来像是您的data-clicks属性未在您的元素上初始化的问题（因为您在第一次点击结束时设置它，然后它似乎按预期工作）。

尝试在.expand-btn元素上初始化它，如下所示：

<a href="#" class="expand-btn" data-clicks='false'>...</a>

或者，如果您有多个展开按钮元素，则可以在使用jQuery加载页面时初始化它们：

$(function(){
     $('.expand-btn').data('clicks',false);
});

jQuery点击第二次点击，但不是第一次点击

1 个答案: