jquery - 单击按钮恢复为内联样式 - jQuery

标签 jquery html css

我在一个页面上有一个 ul li 网格,它从一个插件中应用了内联样式。如果复选框不适用于该元素,则可以在该列表上方选择隐藏/显示任何选项。

我正在尝试添加一个“重置”按钮,将这些样式恢复为正常状态,就像它们在页面加载时一样,所以就像没有发生复选框选择一样。

这是页面加载时一种样式的示例。请注意,它们是从页面的顶部和左侧设置的,因此我无法对特定属性进行硬编码 - 这是来自插件。

position: absolute;
left: 330px;
top: 1320px;

我知道我可以使用 jQuery 一起删除所有样式,但我不知道是否可以将内联样式恢复到页面加载时的状态。

最佳答案

试试这个:

<script>
$(function(){
    var default_styles = new Array();

    default_styles = $('ul li').map(function(){ return $(this).attr('style') }).get();

    $('button').click(function(){
        $('ul li').each(function( i,v ){
            $(v).attr('style', default_styles[i] )
        });
    });
});
</script>

fiddle 添加:https://jsfiddle.net/ehpmvqL7/3/

关于jquery - 单击按钮恢复为内联样式 - jQuery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40851373/

相关文章:

html - 如何在固定位置 div 下定位一个 div

css - order 属性如何作用于 flex 容器的绝对定位子容器?

jquery - 在固定高度的容器中调整图像大小

Javascript 点击事件将多个重复项推送到数组

jQuery UI - 弹跳 - 从左到右跳动的div

javascript - 当异步设置集合时,angular 1.3 中的 ng-option 会忘记 ngmodel

html - 调整内容大小以适应高度 CSS 溢出?

javascript - 在 Jquery 中循环遍历定义大小的元素?

Jquery 选项卡式导航导致下面的元素出现 float 问题

jquery - 无法让 .next() 工作