使用jquery

时间:2016-12-03 15:55:24

标签: javascript jquery css

使用Wordpress编辑器更改文字颜色,我可以使用jquery强制它使其成为背景颜色。

当我更改文本的颜色时,这就是wp呈现的内容:

<p>
   <span style="color: #ff0000;">
      <a style="color: #ff0000;" href="#">Link name</a>
   </span>
</p>

我希望背景是我选择的任何颜色。

有些东西,但我被卡住了。 [SELECTED COLOR]只是一个占位符,所以你可以看到我正在尝试做什么。

$("p span a").css("background-color","[THE SELECTED COLOUR]");

2 个答案:

答案 0 :(得分:1)

这个怎么样,你在那里迭代所有

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>
   <span style="color: #ff0000;">
      <a style="color: #ff0000;" href="#">Link name</a>
   </span>
</p>
<p>
   <span style="color: #0000ff;">
      <a style="color: #0000ff;" href="#">Link name</a>
   </span>
</p>
<script>
  $("p span a").each(function( index ) {
    $( this ).css("background-color", $( this ).css("color"));
    $( this ).css("color", "white");
  });
</script>

或者,正如A.Wollf在评论中建议的那样,使用function

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>
   <span style="color: #ff0000;">
      <a style="color: #ff0000;" href="#">Link name</a>
   </span>
</p>
<p>
   <span style="color: #0000ff;">
      <a style="color: #0000ff;" href="#">Link name</a>
   </span>
</p>
<script>
  $("p span a").css({"background-color":function(){ return $(this).css('color'); }, "color": "white"});
</script>

答案 1 :(得分:0)

希望这会有用

$("p span a").css("background-color","green");

DEMO