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＆amp; padding'实际上是四个单独的margin / padding值的简写，top / left / bottom / right。使用css（'marginTop'）等等 - 请注意，如果你这样指定它们，它们的末尾会有'px'。

在结果周围使用parseInt（）将其转换为数字值。

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

OR

<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" />

Answer 3

在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等属性值设置为一个值，但它本身不是一个属性。

jQuery - css（）在firefox中无法正常工作

3 个答案: