Javascript 如何制作div'；s marginLeft通过单击按钮增加

我正在尝试使用jQuery，想知道如何实现以下情况：

你有一个按钮和一个div

<div class="test"></div>
<button id="move">Move</button>

如何做到这一点？

试试：

$(function() {
  $( "#move" ).on( "click", function() {
      $( ".test" ).animate({
          "margin-left":"+=50px"
      });
   });

});

试试这个

$(function() {

  $( "#move" ).on( "click", function() {
      var mleft= $( ".test" ).css('margin-left');
         mleft=mleft.split('p')[0]-0;
      var newMargin=+mleft+50;
      $( ".test" ).css('margin-left',newMargin+'px');

   });

});

---

您的marginLeft函数的参数错误。第一个是索引，第二个是当前值。所以你可以这样做：

$(function() {
    $( "#move" ).on( "click", function() {
        $( ".test" ).css({
            marginLeft: function( index, margin ) {
                margin = parseInt(margin, 10) + 50;
                value = margin + "px";
                return value;
            }
        });
    });
});

---

从那以后，这就不起作用了。单击两下后，左边的边距变大。@RaphaelRafatpanah现在应该可以了。它只需要将mleft强制为一个数字。@RaphaelRafatpanah您的函数始终提供

margin

0的值。所以边距+=50始终保持在50。您使用的是

margin

而不是

margin left

。

$(function() {
    $( "#move" ).on( "click", function() {
        $( ".test" ).css({
            marginLeft: function( index, margin ) {
                margin = parseInt(margin, 10) + 50;
                value = margin + "px";
                return value;
            }
        });
    });
});