jQuery點擊第二次點擊，但不是第一次點擊

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代碼。 它就像這個jquery插件一樣 ，其中.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);
});