2016-09-27 92 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>