2

如果我有很多元素,可能看起来像:

<p class="test" data-left="250" data-bottom="55">Good morning.</p>
<p class="test" data-left="350" data-bottom="123">Good afternoon.</p>
<p class="test" data-left="290" data-bottom="300">Good night.</p>

...等等,我怎样才能为它们设置动画?我最初尝试过:

$('.test').animate({
  left: $(this).attr('data-left'),
  bottom: $(this).attr('data-bottom')
});

但似乎$(this)这里没有上下文。有没有办法做到这一点?还是只是编写一个.each()循环来实现它?

注意:我们使用的是旧版本的 jQuery,因此使用.attr()

4

2 回答 2

2

您必须遍历这些元素:

$('.test').each(function() {
    var $this = $(this);

    $this.animate({
        left: +$this.attr('data-left'),
        bottom: +$this.attr('data-bottom')
    });
});

我认为您可能还必须将无单位字符串解析为数字。

于 2013-02-13T11:02:35.167 回答
0

你需要使用.each()

$('.test').each(function(){
   $(this).animate({
            left:$(this).attr('data-left'),
            bottom:$(this).attr('data-bottom')
   })
});
于 2013-02-13T11:01:14.253 回答