如何为多次单击按钮创建函数

Question

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

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

});

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

我查看了文档并进行了一些测试，但没有找到解决方案。我知道我需要学习和测试 jquery :).

Answer 1

假设您希望连续点击元素 enable/disable top CSS 定位在 .fit 元素上，您可以使用 toggleClass。

首先，在 CSS 中设置 class:

.fit.top {
    top: 200px;
}

然后，在您的 jQuery 代码中使用 toggleClass() 函数：

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

Answer 2

您需要的是一种切换按钮，所以试试这个：

添加一个cssclass

.themargin{
    top: 200px;
}

然后在每次点击时切换 class

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

功能文档here

How create a function for multiple click on button