jQuery - css()在firefox中无法正常工作

Question

我.css()用来从元素中获取样式.但在Firefox .css()中没有得到的价值margin,并padding从元素.

请看小提琴: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" />

Answer 1

CSS标签'margin&padding'实际上是四个单独的边距/填充值(上/左/下/右)的简写.使用css('marginTop')等 - 请注意,如果您已经指定了它们,它们将在末尾有'px'.

在结果周围使用parseInt()将其转换为数字值.

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

要么

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

这会给你价值.使用此技术,您可以获得边距和填充的值.

Answer 2

这是因为属性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" />