如何实现选择多个TD，并且取消选择后要恢复原来的背景图片

<style>
body{b:expression(document.onclick=function(){check()})}
body{d:expression(document.onkeydown=function(){setKey()})}
body{r:expression(document.onkeyup=function(){resetKey()})}
tr{t:expression(this.onclick=function(){setSelect(this)})}
</style>
<script>
var ctrlKey=false;   //判断是否按住Ctrl键
var options='';      //选中的项
var selectImg='1.jpg';  //定义选中的背景
var unselectImg='2.jpg';    //定义未选中背景
function setSelect(obj)
{
  if(ctrlKey==false)
  {
  for(var i=0;i<obj.parentNode.parentNode.rows.length;i++)
   {
      obj.parentNode.parentNode.rows[i].childNodes[0].style.backgroundImage='url(unselectImg)';
   }   obj.childNodes[0].style.backgroundImage='url(selectImg)';
  }
  else
  {
    obj.childNodes[0].style.backgroundImage='url(selectImg)';
  }
  
  if(ctrlKey==false)
     show();  }
function check()
{   if(event.srcElement.tagName!='BODY')
     {
        return;
     }
   else
     {
        var obj=document.getElementsByTagName('table')[0];
        for(var i=0;i<obj.rows.length;i++)
          {
            obj.rows[i].childNodes[0].style.backgroundImage='url(unselectImg)';
          }
     }
}
function setKey()
{
  if(event.ctrlKey)
   {
     ctrlKey=true;
   }
}
function resetKey()
{  if(ctrlKey==true)
   {
     ctrlKey=false;  
     show();
   }  
   
}function show()
{
  var obj=document.getElementsByTagName('table')[0];
  for(var i=0;i<obj.rows.length;i++)
    {
      if(obj.rows[i].childNodes[0].style.backgroundImage=='url(selectImg)')
         options=options+obj.rows[i].childNodes[0].innerText+'\n'
    }
  
  alert('您选择了:\n'+options);
  options='';
 
}</script>
<body>
<table>
<tr>
<td>AAAAAAA</td>
</tr>
<tr>
<td>BBBBBBB</td>
</tr>
<tr>
<td>CCCCCCC</td>
</tr>
</table>
</body>

解决方案 »

  1.   

    to：木野狐
    选择是点击一下to： vivianfdlpw
    关键是var unselectImg='2.jpg';    //定义未选中背景
      

  2.   

    修正了一下，原来的有点问题<style>
    body{b:expression(document.onclick=function(){check()})}
    body{d:expression(document.onkeydown=function(){setKey()})}
    body{r:expression(document.onkeyup=function(){resetKey()})}
    tr{t:expression(this.onclick=function(){setSelect(this)})}
    </style>
    <script>
    var ctrlKey=false;   //判断是否按住Ctrl键
    var options='';      //选中的项
    var selectImg='1.jpg';  //定义选中的背景
    var unselectImg='2.jpg';    //定义未选中背景
    function setSelect(obj)
    {
      if(ctrlKey==false)
      {
      for(var i=0;i<obj.parentNode.parentNode.rows.length;i++)
       {
          obj.parentNode.parentNode.rows[i].childNodes[0].style.backgroundImage='url('+unselectImg+')';
       }   obj.childNodes[0].style.backgroundImage='url('+selectImg+')';
      }
      else
      {
        obj.childNodes[0].style.backgroundImage='url('+selectImg+')';
      }
      
      if(ctrlKey==false)
         show();  }
    function check()
    {   if(event.srcElement.tagName!='BODY')
         {
            return;
         }
       else
         {
            var obj=document.getElementsByTagName('table')[0];
            for(var i=0;i<obj.rows.length;i++)
              {
                obj.rows[i].childNodes[0].style.backgroundImage='url('+unselectImg+')';
              }
         }
    }
    function setKey()
    {
      if(event.ctrlKey)
       {
         ctrlKey=true;
       }
    }
    function resetKey()
    {  if(ctrlKey==true)
       {
         ctrlKey=false;  
         show();
       }  
       
    }function show()
    {
      var obj=document.getElementsByTagName('table')[0];
      for(var i=0;i<obj.rows.length;i++)
        {
          if(obj.rows[i].childNodes[0].style.backgroundImage=='url('+selectImg+')')
             options=options+obj.rows[i].childNodes[0].innerText+'\n'
        }
      
      alert('您选择了:\n'+options);
      options='';
     
    }</script>
    <body>
    <table>
    <tr>
    <td>AAAAAAA</td>
    </tr>
    <tr>
    <td>BBBBBBB</td>
    </tr>
    <tr>
    <td>CCCCCCC</td>
    </tr>
    </table>
    </body>