当鼠标点符号击表格外，表格的背景颜色变成白色

2013-07-01

当鼠标点击表格外，表格的背景颜色变成白色!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//

当鼠标点击表格外，表格的背景颜色变成白色
<!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>
<script type="text/javascript">
var cur;
window.onload=function(){
var otr=document.getElementsByTagName("tr");
for(var i=1 ;i<otr.length;i++){
otr[i].onclick=function (){

cur?cur.style.background="white":"";
change(this);
cur=this;
}
}
}
function change(obj){
obj.style.background="yellow";
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body><table width="200" border="1" cellspacing="1" cellpadding="1">
  <tr>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
  </tr>
  <tr>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
  </tr>
  <tr>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
  </tr>
  <tr>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
  </tr>
  <tr>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
  </tr>
  <tr>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
  </tr>
  <tr>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
  </tr>
  <tr>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
  </tr>
  <tr>
    <td> </td>
    <td> </td>

    <td> </td>
    <td> </td>
    <td> </td>
  </tr>
  <tr>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
    <td> </td>
  </tr>
</table>

</body>
</html>
javascript? HTML 函数 onclick
[解决办法]
简单就这样吧，也可以添加事件td.onmouseout,


window.onload = function(){
    var oTab = document.getElementById('tab');
    var aTr = oTab.getElementsByTagName('tr');
    var cur = 0;
    
    for(var i = 0; i < aTr.length; i++){
        aTr[i].index = i;
        aTr[i].onclick = function(){
            this.style.background = '#f60';
            cur = this.index;
        }
    }
    document.onclick = function(e){
        e = e 
[解决办法]
 event;
        src = e.srcElement 
[解决办法]
 e.target;
        if(src.tagName.toLowerCase() != 'td'){
            for(i = 0; i < aTr.length; i++){
                aTr[i].style.background = '';
            }
        }
    }
}

[解决办法]

// 给table 加个 id 属性，假设id为table1

.blur tr{ background-color:#FFFFFF;}

document.onclick = function(e){
    e = e 
[解决办法]
 window.event;
    o = e.srcElement 
------解决方案--------------------  
 e.target;
    while(o.parentNode){
        if(o.id == "table1") return;
        o = o.parentNode;
    }
    document.getElementById("table1").className='blur';
}

[解决办法]
document.onclick = function(e){
    e = e
[解决办法]
window.event;
    o = e.srcElement
[解决办法]
e.target;
    while(o.parentNode){
        if(o.id == "table1"){
            document.getElementById("table1").className='';
            return;
        }
        o = o.parentNode;
    }
    document.getElementById("table1").className='blur';
}
[解决办法]

引用:

document.onclick = function(e){
    e = e
[解决办法]
window.event;
    o = e.srcElement
[解决办法]
e.target;
    while(o.parentNode){
        if(o.id == "table1"){
            document.getElementById("table1").className='';
            return;
        }
        o = o.parentNode;
    }
    document.getElementById("table1").className='blur';
}

document.onclick = function(e){
    e = e 
[解决办法]
 window.event;
    o = e.srcElement 
[解决办法]
 e.target;
    while(o.parentNode){
        if(o.id == "table1"){
            document.getElementById("table1").className='';
            return;
        }
        o = o.parentNode;
    }
    document.getElementById("table1").className='blur';
}

热点排行

Bad Request.

JavaScript

当鼠标点符号击表格外， 表格的背景颜色变成白色

当鼠标点符号击表格外，表格的背景颜色变成白色