在Jquery中设置CSS属性时如何使用变量？

我正在努力使以下各项发挥作用：

var $marPad = $('#wrapper').attr('id') == "overthrow" ? 
      ["margin-top", "margin-bottom"] : ["padding-top", "padding-bottom"];

$("#toBeSet").css({ 
    $marPad[0] : "100px", 
    $marPad[1] : "100px"
    })  

这样，我希望只使用一个css setter就可以了。然而Firebug总是告诉我，我不能像$marPad[0]那样制作CSS选择器。它总是在属性id之后返回缺少的

有人能告诉我我做错了什么吗？有没有可能也使用变量而不是固定的CSS选择器

谢谢你的帮助

试试看：

$("#toBeSet").css($marPad[0], "100px").css($marPad[1], "100px");

---

您需要首先创建对象，然后向其添加属性

var obj = {}; 

obj[$marPad[0]] = '100px';
obj[$marPad[1]] = '100px';

$("#toBeSet").css(obj);

也许最好首先将其作为条件语句的一部分

var $marPad = $('#wrapper').attr('id') == "overthrow" ? 
      {marginTop:'100px', marginBottom: '100px'} : {paddingTop:'100px', paddingBottom:'100px'};

$("#toBeSet").css($marPad);

---

不能在对象文本中使用变量作为名称。创建对象并向其添加属性：

var o = {};
o[$marPad[0]] = "100px";
o[$marPad[1]] = "100px";

$("#toBeSet").css(o)  

---

不计算对象文字定义的

键

部分。也就是说，你不能这样做：

x = {
  1 + 1: 'foo'
};

obj = {};
obj[$marPad[0]] = "100px"; 
obj[$marPad[1]] = "100px";
$('#toBeSet').css(obj);

尽管您并不总是需要引号，但左侧被视为字符串标识符。然后，不计算变量：

foo = 'bar';
x = {
  foo: 'my value'
}
x.bar === undefined;
x.foo === 'my value';

计算表达式的唯一方法是使用方括号表示法：

foo = 'bar';
x = {};  // an empty object
x[foo] = 'my value';    // <-- foo is evaluated, returns the string value 'bar'

x.bar === 'my value';
x.foo === undefined;

// and to clarify:
x['foo'] === undefined;
x[foo] === 'my value'

---

这很有效。你知道如何在CSS规则中添加多个元素吗？我想这绕过了问题的实质：为什么语法的行为不符合预期？我认为它的行为符合预期，在其他答案中有一些很好的解释-以这种方式定义对象时，键必须是字符串（可以不加引号-这与JSON对象不同）。这是一种简洁的方法！谢谢！都很好。第二个解决方案看起来更好。我的原始代码稍微复杂一些，所以我倾向于第一个版本。如果我错了，请更正我，但

$（“#包装器”）。attr（'id'）=“推翻”

将始终返回false，因为您是按ID选择元素并检查其ID是否为非ID。因此

$marPad

将始终等于

[“padding top”，“padding bottom”]

@jasper-正确。我刚刚弥补了这个问题。我正在检查一个自定义的jqm数据属性，它工作正常。不过谢谢您的指点！