1

我正在为我当前的项目使用 zepto.js，它具有与removeAttr()jquery 相同的方法。

我正在将 amargin-top应用于一堆元素 - 工作正常。

var $apply = $('aside[role="sub"], aside[role="event-info"], aside[role="attend"]');
$apply.css('margin-top', '100px'); //works fine

但是，我还需要在调整大小事件中再次删除它。

if ( $(window).width() <= 984 ) {
    //$apply.removeAttr('style'); //doesn't take effect
    $apply.css('margin-top', '0'); //works fine
    console.log('< 984');       
}

所以我可以设置margin-top回，0但不能从选择器中完全删除样式属性。

任何想法为什么？我没有得到任何错误，它只是没有生效。

4

3 回答 3

3

来自http://api.jquery.com/css/

将样式属性的值设置为空字符串 — 例如 $('#mydiv').css('color', '') — 如果该属性已被直接应用，则从元素中删除该属性，无论是在 HTML 样式中属性，通过 jQuery 的 .css() 方法，或者通过 style 属性的直接 DOM 操作。但是，它不会删除在样式表或元素中使用 CSS 规则应用的样式。

所以你可以使用$apply.css('margin-top', '')删除margin-top样式。

用于.removeClass()从元素中删除所有样式。

于 2012-07-26T14:25:18.443 回答
3

删除它的正确方法是在使用.css.

$apply.css('margin-top', ''); // remove property

当某个属性的值为空时，该属性将被删除。

在这里阅读更多。

于 2012-07-26T14:25:39.597 回答
3

我建议创建一个您添加和删除的 CSS 类。这样，您可以轻松地在一个位置修改边距值，而不必在多个位置进行更改。

CSS：

.myMargin { margin-top : 100px; }

JS：

var $apply = $('aside[role="sub"], aside[role="event-info"], aside[role="attend"]');
$apply.addClass("myMargin");

在调整大小事件中：

if ( $(window).width() <= 984 ) {
    $apply.removeClass("myMargin");
    console.log('< 984');       
}
于 2012-07-26T14:27:30.850 回答