JavaScript/jQuery 制作触发器时遇到问题

Question

所以，我只是想在单击按钮时触发一个元素从它的位置到另一个位置。然后，如果我再次单击该按钮，我希望它回到原来的位置。我有这个代码。

$(document).ready(function() {
    $('.trigger').click(function() {
    $('.trigger').toggle(
         function() {
             $('.mod').css({'margin-left':'0px'});
             },
         function() {
             $('.mod').css({'margin-left':'-100px'});
             }
         );
    });
});

当我按下按钮时，元素会执行我想要的操作。但按钮消失了。我不太确定该元素是否会被触发。
现在我只想要一个可以完成这项工作的工作代码。

Answer 1

.toggle() 正在隐藏和显示目标元素，因此您需要其他内容。一种方法是，仅检查元素的 margin-left:

$(document).ready(function() {
    $('.trigger').click(function() {
        alert($('.mod').css('margin-left'));
        if($('.mod').css('margin-left') == '0px') {
           $('.mod').css('margin-left', '-10px');
        }
        else {
            $('.mod').css('margin-left', '0px');
        }
    });
});

Fiddle