如标题,页面上有几个div:
<div style="width:100px; height:100px; position: absolute;left:10px; top:10px; border: 1px solid black; background: white;"></div>
<div style="width:100px; height:100px; position: absolute;left:200px; top:10px; border: 1px solid black; background: white;"></div>
。当鼠标点击时如果点中div就把当前div背景色设置成red,其他的还原成原来的white,如果没点中div,把上一次设置成red的还原成white。本人新手,希望各位大神不要见笑,谢谢!

解决方案 »

  1.   


    <!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" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
    <title>无标题文档</title>
    </head><body>
    <div style="width:100px; height:100px; position: absolute;left:10px; top:10px; border: 1px solid black; background: white;"></div>
    <div style="width:100px; height:100px; position: absolute;left:200px; top:10px; border: 1px solid black; background: white;"></div><script type="text/javascript">
    jQuery(function($){
    $(document).bind("click",function(e){
    $('div').each(function(){
    if($(e.target).closest($(this)).length == 0){
    $(this).css({'backgroundColor': '#fff'});
    }else{
    $(this).css({'backgroundColor': '#f00'});
    }
    });
    });
    });
    </script>
    </body>
    </html>
      

  2.   

    $(function(){
     var allDiv=$("div").click(function(){
    allDiv.css("background-color","#fff");
    this.style.backgroundColor="red";
    return false;
     });
     $(window.body).click(function(event){
    if(eventPhase==3)return false;
    allDiv.css("background-color","#fff");
     });
     });
      

  3.   

    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <body>
    <div style="width:100px; height:100px; position: absolute;left:10px; top:10px; border: 1px solid black; background: white;"></div>
    <div style="width:100px; height:100px; position: absolute;left:200px; top:10px; border: 1px solid black; background: white;"></div>
    </body>
    <script>
    $(document).click(function(e){
    if(e.target.tagName.toUpperCase()=="DIV"){
    $("div").css("background", "white")
    $(e.target).css("background", "red")
    }
    });
    </script>