jQuery 3.1.1 slideToggle（）/ toggle（）出現故障

Question

我閱讀了很多有關jQuery toggle / slideToggle的文章，但似乎都沒有回答我的問題，所以這是我的問題：

我使用的是jQuery 3.1.1。版，並且我的slideToggle（）（包括所有其他與切換相關的事件）似乎不起作用（請參見下面的代碼）。 當我單擊“ .register-parent”時，“。sign-up-parent-form”（也是“ sign-up-form”類的一部分）滑出，然后立即滑回到“隱藏”模式。
是否因為我需要在括號中包括速度，回調等而發生這種情況？ 我使用代碼編輯器，它說我的代碼沒有錯。

/*global $ */
$(document).ready(function () {
  "use strict";
  $(".sign-up-form").hide();

  $(".register-parent").click(function () {
    $(".sign-up-parent-form").slideToggle();
  });
});

我的HTML和CSS在這里 。 非常感謝！

Answer 1

您的DOM中有2 .register-parent'元素，因此該事件兩次附加到該特定類。 這就是為什么當您單擊一次時，兩個事件都被觸發。

更特別地，附加事件，或使用stopPropagation如提到的@Super User。

Answer 2

您可以為此使用stopPropagation ，可以使用以下代碼更新JS代碼：

/*global $ */
$(document).ready(function () {
    "use strict";
    $(".sign-up-form").hide();

    $(".register-parent").click(function (e) {
        e.stopPropagation();
        $(".sign-up-parent-form").slideToggle();
    });
});

有關更新的小提琴演示， 請單擊此處