javascript - jQuery 在每个选定对象上触发函数

Question

我试图在 javascript/jquery 中创建一个函数，为所选对象创建一个很酷的动画。问题是，当我也添加更多对象时，它的行为很奇怪。

我知道这是因为如果我也添加 4 个对象，代码将运行 4 次。我该如何更改它以便它只对所有选定的对象执行一次？

代码:

function showPress(name) {
    var top = "15";
    var bottom = "20";

    $(name).hide();

    $(name).show(150, function() {
        $(name).animate( {
            "margin-top": "+="+top+"px",
            "margin-left": "+="+bottom+"px"
        }, 150, function() {
            $(name).animate({
                "margin-top": "-="+top+"px",
                "margin-left": "-="+bottom+"px"
            });
        });
    });
}

showPress("h1");

TL;DR:这是怎么回事，我该如何解决？ (我试过但失败了)

http://jsfiddle.net/LWRAj/

Answer 1

为this改变name的内部引用:

$(name).show(150, function () {

    $(this).animate({

        "margin-top": "+="+top+"px",
        "margin-left": "+="+bottom+"px"

    }, 150, function () {

        $(this).animate({

            "margin-top": "-="+top+"px",
            "margin-left": "-="+bottom+"px"

        });
    });
});

JSFiddle