jQuery-css（）在Firefox中無法正常工作

我正在使用.css()從元素中獲取樣式。但在Firefox中.css()沒有從元素獲得margin和padding的值。jQuery-css（）在Firefox中無法正常工作

請參閱小提琴： http://jsfiddle.net/howtoplease/fMTsW/

這是我的jQuery代碼：

$(document).ready(function(){ 
    $('input').each(function(){ 
     this.value = $('h3').css(this.name); 
    }); 
});

我的HTML代碼

<h3 style="margin:20px;padding:20px;font-size:30px;font-family:'open sans';"> 
    I am heading 3 
</h3> 

<input name="margin" /> 
<input name="padding" /> 
<input name="font-size" /> 
<input name="font-family" />

來源

2013-07-19 user007

它工作正常。 –

不，請仔細檢查。等待您使用的是什麼瀏覽器？ – user007

我認爲鉻的最新版本。 –

的CSS標籤 '保證金&填充'實際上是一個簡寫f或四個單獨的邊距/填充值，上/左/下/右。使用css（'marginTop'）等等 - 注意，如果你已經指定了它們，那麼它們最終會有'px'。

在結果周圍使用parseInt（）將其轉換爲數字值。

<input name="margin-top" /> 
<input name="padding-top" />

<input name="marginTop" /> 
<input name="paddingTop" />

這會給你的價值。使用這種技術，您可以獲得邊距和填充的值。

來源

2013-07-19 03:15:42

奇怪的是，在Chrome瀏覽器中使用jQuery的簡稱，而不是jQuery Firefox。 – Garrett

發生這種情況，因爲像margin和padding屬性是短手財產和jQuery不能給你這些值，你必須使用獨立的值，如margin-top和margin-right。

此外，與像margin-top多個單詞屬性應該使用marginTop即第二字的第一個字母應資本進行訪問。

對於全套值：

<input name="marginTop" /> 
<input name="marginRight" /> 
<input name="paddingTop" /> 
<input name="paddingRight" /> 
<input name="fontSize" /> 
<input name="fontFamily" />

來源

2013-07-19 03:17:11 Starx

在你的代碼fiddle我試圖改變HTML。

從

<input name="margin"/> 
<input name="padding"/>

要

<input name="margin-left"/> 
<input name="padding-left"/>

和值中的輸入值字段正確設定。這是因爲css中的margin是一個關鍵字，它將margin-right，margin-left，margin-top，margin-bottom等屬性的值設置爲一個值，但它本身不是屬性。

來源

2013-07-19 03:21:55

jQuery-css（）在Firefox中無法正常工作

回答

相關問題