如何将变量传递给jquery动画函数属性？

Question

function SlideObject(Side) {
    $("#div").animate({
        margin+Side: "-1000px",
        opacity: "hide"
    }, 1000);
}

我想将“Side”的值传递给animate函数的属性标识符（margin）的名称。

我知道“margin + Side”无效只是作为占位符。例如，如果我手动指定属性名称，则可以将“marginLeft”命名为一个示例。我想提供“Left”，“Right”，“Top”或“Bottom”作为SlideObject函数的参数。

我遇到了麻烦，一个例子会很精彩。

由于

Answer 1

首先，不使用eval()来执行此操作。没有必要，如果您以任何方式使用用户输入作为其中一部分（直接或间接），则会使您的网站暴露于漏洞。正确的方法是：

<div id="div">This is a test</div>

使用CSS：

#div { padding: 15px; background: yellow; }

和Javascript：

function slideObject(side) {
  var anim = {opacity: 0};
  anim["margin" + side] = "-1000px";
  $("#div").animate(anim, 1000);
}

$(function() {
  slideObject("Left");
});

您会注意到opacity值已更改为0. hide不是opacity的有效值。

基本上，您创建匿名对象，然后使用[]分配动态属性。