JqueryでCSSプロパティを設定する際の変数の使い方は？

Question

は私が仕事に次取得しようとしている：私は、単一のCSSセッターとすることにより取得することを期待していた

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

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

この方法です。しかし、Firebugはいつも私には、$ marPad [0]のようなCSSセレクタを作れないと言います。それは常にを返します：プロパティIDの後。

誰かが私が間違っていることを教えてもらえますか、固定CSSセレクタの代わりに変数を使用することは可能ですか？

ありがとうございました！

Answer 1

あなたが最初にプロパティを追加し、オブジェクトを作成する必要があります。

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); 

Answer 2

試してみてください。

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

Answer 3

あなたはオブジェクトリテラル内の名前などの変数を使用することはできません。オブジェクトを作成し、それにプロパティを追加：オブジェクトリテラル定義の

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

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

Answer 4

key部分は評価されません。

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

あなたは常に引用符は必要ありませんが、左側が文字列識別子として扱われます。それはあなたがこのような何かを行うことはできません。その後、変数が評価されていないことを、次のとおりです。

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' 

、@amとして、直接あなたの質問に答えるために私は言っていない、あなたはこのような何か必要があります。

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