2016-09-27 91 views
1

我试图内嵌样式添加到使用jQuery的一个div,以下是div,因为我的萤火(附后)检查添加内嵌样式动态生成的div使用jQuery

enter image description here

我想保留现有CSS还有,我只需要添加margin-left:0margin-right:0现有的类,下面的jquery我试过,但没有运气:

jQuery(document).ready(function($){ 
    $(".testimonial_wrapper").css({'margin-left':'auto', 'margin-right':'auto'});  
}); 

什么其他的方式来实现? (请注意,我编辑WordPress站点和申报单从页面建设者插件生成)

+0

这是不可能知道的问题是....是的div时产生? – DaniP

+0

divs是从插件生成的,该插件有拖放操作 –

+0

如果您知道必须重写的类,则可以使用CSS来完成。如果名称也是动态生成的(例如class-1或class-32),那么您必须看到动态生成过程用CSS覆盖它。 jQuery不能否决'!important'CSS,因为你不能发送'!important'作为参数。你只能删除这个类,并把你想要的那个放回去。(你应该克隆这个类的CSS,在其他类名下改变你想要的名称,然后把它放回到你的CSS类名中。) –

回答

1

我认为你必须从function($)擦除$和本身的功能改变$jQuery

jQuery(document).ready(function(){ 
    jQuery(".testimonial_wrapper").css({'margin-left':'auto', 'margin-right':'auto'});  
}); 
+0

当我删除$我得到错误,未捕获TypeError:$是不是一个函数 –

+0

我错过了添加jQuery,现在添加和它的工作! –

+0

我刚刚更改/编辑了我的答案...... – Johannes

0

也许你可以添加内联CSS:

<style type="text/css"> 
    div.testimonial_wrapper { 
     padding-left : auto !important; 
     padding-right: auto !important; 
    } 
</style> 

以上将适用于新的元素还,但要确保说到之后的.css包括

+0

我希望我可以,但是已经有一个css定义了重要的不可编辑:( –

+0

,这就是我决定用jQuery去添加内联的原因.. –

+0

我编辑了我的答案。 – Ted

0

我已经加了我自己的风格和您所需的样式也与出令人不安的线条样式

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
<script> 
 
$(document).ready(function(){ 
 
    $("button").click(function(){ 
 
     $("p").css("background-color", "yellow"); 
 
     $(".testimonial_wrapper").css({'margin-left':'auto', 'margin-right':'auto'});  
 
    }); 
 
}); 
 
</script> 
 
</head> 
 
<body> 
 

 
<h2>This is a heading</h2> 
 

 
<p class="testimonial_wrapper" style="background-color:#ff0000;border:1px solid #000;">This is a paragraph.</p> 
 
<p class="testimonial_wrapper" style="background-color:#00ff00;border:1px solid #000;">This is a paragraph.</p> 
 
<p class="testimonial_wrapper" style="background-color:#0000ff;border:1px solid #000;">This is a paragraph.</p> 
 

 
<p>This is a paragraph.</p> 
 

 
<button>Set background-color of p</button> 
 

 
</body> 
 
</html>