javascript - 如何创建多次点击按钮的功能

Question

最初我说我是 jquery 和 js 的新手:D，我需要在 jquery 中创建一个函数来在按钮上的单击事件后添加 css 规则，我已经完成了并且它有效:

   $(".resp-toogle").on("click",function() {
    $(".fit").css('top','200px');

});

在这种情况下，当 .resp-toogle 上有一个点击操作时，会添加一个 css 规则来适合 css 类。但我需要再次单击 .resp-toogle ，将重置适合类别的上边距。

我已经检查了文档并测试了一些东西，但我没有找到解决方案。我知道我需要使用 jquery 进行学习和测试:)。

Answer 1

假设您希望连续单击该元素来启用/禁用 .fit 元素上的 top CSS 定位，则可以使用 toggleClass.

首先，在 CSS 中设置类:

.fit.top {
    top: 200px;
}

然后，在 jQuery 代码中使用 toggleClass() 函数:

$(".resp-toogle").on("click",function() {
    $(".fit").toggleClass('top');
});

Example fiddle