css更新vline和hline

Question

我正在使用Jcrop插件来裁剪图像，但对jQuery没有很大的了解。我需要让选择边界改变动态基础上的无线电按钮选择。在css中，有一个用于选择边框宽度的属性(.如果我手动将宽度更改为“10 If！重要”，这一切都很好。

现在我想用Jquery更改width属性，但是它什么也不做，下面是我的代码的一部分(如果需要更多代码，请告诉我)：

原文css：

.jcrop-vline {
  height: 100%;
  width: 1px !important;
}

.jcrop-hline {
  height: 1px !important;
  width: 100%;
}

以及我的html文件中的jQuery：

<script type="text/javascript">
$('#size').change(function(){
  $('.jcrop-vline').css('width', '10px !important');
  alert('Test');
})
</script>

我添加了警报以检查代码是否被执行，并且警报可以工作。但是宽度属性不会改变。css文件包含在我的html中(否则当我手动更改它时，它就不能工作了)。我的问题是，为什么这不起作用？

Answer 1

使用jquery重写重要内容的方法。

1.使用attr：

$('.jcrop-vline').attr('style', 'width: 10px !important;');​

2.使用新的类

<style type="text/css">
    .jcrop-vline {
       height: 100%;
       width: 1px !important;
     }
    .jcrop-vline1 {
       height: 100%;
       width: 10px !important;
     }
    </style>

$('unique id').removeClass('jcrop-vline').addClass('jcrop-vline1'); 

3.远程服务：

$('unique id.jcrop-vline').removeClass('jcrop-vline').css('width', '10px');

4.每项职能

$( '.jcrop-vline' ).each(function () {
   this.style.setProperty( 'width', '10px', 'important' );
});

为什么不能覆盖以下重要内容：

在同一层次上，重要的事情比任何事情都重要。