使用Jquery更改背景颜色(css属性)

时间:2022-10-13 19:43:16

I would like to change the background colour of my body on click.

我想在点击时改变我身体的背景颜色。

This is my code that I have tried, any help would be appreciated :)

这是我试过的代码,任何帮助都会受到赞赏:)

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">

$(document).ready(function(){
   $(#foo).click(change() {
   $(body).css("background-color":"blue");
});
}); 

CSS code

body
{
background-color:red;
}

Body code

<body>        
<div id="foo" onclick="change()">
Hello
</div>

6 个解决方案

#1


21  

You're using a colon instead of a comma. Try:

你使用的是冒号而不是逗号。尝试:

$(body).css("background-color","blue");

You also need to wrap the id in quotes or it will look for a variable called #co

您还需要将id包装在引号中,否则它将查找名为#co的变量

$("#co").click(change()

There are many more issues here. click isn't an HTML attribute. You want onclick (which is redundant). Try this:

这里还有很多问题。 click不是HTML属性。你想要onclick(这是多余的)。尝试这个:

<div id="co"> <!-- no onclick method needed -->
<script>
$(document).ready(function() {
    $("#co").click(function() {
        $("body").css("background-color","blue"); //edit, body must be in quotes!
    });
});
</script>

You were trying to call an undefined method. It looks like you were trying to declare it inside the callback statement? I'm not sure. But please compare this to your code and see the differences.

你试图调用一个未定义的方法。看起来你试图在回调语句中声明它?我不确定。但请将其与您的代码进行比较并查看差异。

http://jsfiddle.net/CLwE5/ demo fiddle

http://jsfiddle.net/CLwE5/演示小提琴

#2


3  

Try this

$("body").css({"background-color":"blue"}); 

#3


2  

$("#co").click(function(){
   $(this).css({"backgroundColor" : "blue"});
});

#4


1  

The code below will change the div to blue.

下面的代码会将d​​iv更改为蓝色。

<script>
 $(document).ready(function(){ 
   $("#co").click({
            $("body").css("background-color","blue");
      });
    }); 
</script>
<body>
      <div id="co">hello</div>
</body>

#5


0  

1.Remove onclick method from div element

1.从div元素中删除onclick方法

2.Remove function change() from jQuery code and in place of that create an anonymous function like:

2.从jQuery代码中删除函数change(),代替它创建一个匿名函数,如:

$(document).ready(function()
{

  $('#co').click(function()
   {

  $('body').css('background-color','blue');
  });
});

#6


0  

$("#bchange").click(function() {
    $("body, this").css("background-color","yellow");
});

#1


21  

You're using a colon instead of a comma. Try:

你使用的是冒号而不是逗号。尝试:

$(body).css("background-color","blue");

You also need to wrap the id in quotes or it will look for a variable called #co

您还需要将id包装在引号中,否则它将查找名为#co的变量

$("#co").click(change()

There are many more issues here. click isn't an HTML attribute. You want onclick (which is redundant). Try this:

这里还有很多问题。 click不是HTML属性。你想要onclick(这是多余的)。尝试这个:

<div id="co"> <!-- no onclick method needed -->
<script>
$(document).ready(function() {
    $("#co").click(function() {
        $("body").css("background-color","blue"); //edit, body must be in quotes!
    });
});
</script>

You were trying to call an undefined method. It looks like you were trying to declare it inside the callback statement? I'm not sure. But please compare this to your code and see the differences.

你试图调用一个未定义的方法。看起来你试图在回调语句中声明它?我不确定。但请将其与您的代码进行比较并查看差异。

http://jsfiddle.net/CLwE5/ demo fiddle

http://jsfiddle.net/CLwE5/演示小提琴

#2


3  

Try this

$("body").css({"background-color":"blue"}); 

#3


2  

$("#co").click(function(){
   $(this).css({"backgroundColor" : "blue"});
});

#4


1  

The code below will change the div to blue.

下面的代码会将d​​iv更改为蓝色。

<script>
 $(document).ready(function(){ 
   $("#co").click({
            $("body").css("background-color","blue");
      });
    }); 
</script>
<body>
      <div id="co">hello</div>
</body>

#5


0  

1.Remove onclick method from div element

1.从div元素中删除onclick方法

2.Remove function change() from jQuery code and in place of that create an anonymous function like:

2.从jQuery代码中删除函数change(),代替它创建一个匿名函数,如:

$(document).ready(function()
{

  $('#co').click(function()
   {

  $('body').css('background-color','blue');
  });
});

#6


0  

$("#bchange").click(function() {
    $("body, this").css("background-color","yellow");
});