【新手问题】一个标签点击变颜色，需要jquery写的

比如一个<p>标签的背景色。现在想实现点击这个<p>标签的时候如果背景是红色的话那么变成蓝色，如果是蓝色的就变成红色。新手嘛，大家见谅。呵呵    $("p.menu_head").click(function()   
           { 
  囧囧囧囧囧囧囧囧囧囧囧囧囧      if(囧囧囧囧囧囧囧囧囧囧囧){
             $(this).css({background:"red"});
     }else{
$(this).css({background:"#000"});
 }
           }); 

解决方案 »

  1.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Untitled Document</title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.1.js"></script>
    <script type="text/javascript">
    $(function(){
    $('p').toggle(function(){
    $(this).css('backgroundColor','red');
    },function(){
    $(this).css('backgroundColor','blue');
    });
    });
    </script>
    </head>
    <body>
    <p>我在这里</p>
    </body>
    </html>
      

  2.   

    最好定义两个CSS类，不然会有兼容性问题，IE返回red，其它一些浏览器返回rgb(255,0,0)。
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
    <script type="text/javascript">
    $(document).ready( function() {
    $("p.menu_head").click( function() {
    if ($(this).hasClass("bgRed")) $(this).removeClass("bgRed").addClass("bgBlue");
    else $(this).removeClass("bgBlue").addClass("bgRed");
    });
    });
    </script>
    <style type="text/css">
    p.bgRed { background-color:red; }
    p.bgBlue { background-color:blue; }
    </style>
    </head><body>
    <p class="menu_head bgRed">test</p>
    </body>
    </html>