避免在某些情况下使用jquery更改颜色？_Jquery_Mouseevent_Background Color

避免在某些情况下使用jquery更改颜色？

jquery

避免在某些情况下使用jquery更改颜色？,jquery,mouseevent,background-color,Jquery,Mouseevent,Background Color,嗨我有一张包含16个td标签的表格。每个td都有鼠标切换事件，可以改变td的背景颜色。但问题是，如果用户单击某个td，则该td标签的背景颜色必须更改为其他颜色，对于该td，不应发生mouseover/over事件。这意味着，在已单击的mouseover和mouseout事件上不应更改td的背景颜色…我的代码中有什么错误这是我的代码 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.

嗨

我有一张包含16个td标签的表格。每个td都有鼠标切换事件，可以改变td的背景颜色。但问题是，如果用户单击某个td，则该td标签的背景颜色必须更改为其他颜色，对于该td，不应发生mouseover/over事件。这意味着，在已单击的mouseover和mouseout事件上不应更改td的背景颜色…我的代码中有什么错误

这是我的代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  <style>

  table,table td{
   border:1px solid;
  }
  </style>
 </head>

 <body>

  <table>
   <tr><td>1</td><td>2</td><td>3</td><td>4</td></tr>
   <tr><td>5</td><td>6</td><td>7</td><td>8</td></tr>
   <tr><td>9</td><td>10</td><td>11</td><td>12</td></tr>
   <tr><td>13</td><td>14</td><td>15</td><td></td></tr>
  </table>
 </body>

 <script>
  $(document).ready(function(){

   $('table td').mouseover(function(){
   if($(this).selected!='X')
     $(this).css({'background-color':'#ffff66'});
   });

   $('table td').mouseout(function(){
     if($(this).selected!='X')
    $(this).css({'background-color':'#fff'});
   });

  $('table td').click(function(){
    $(this).css({'background-color':'#6666ff'});
    $(this).selected='X';
   });

  });
 </script>
</html>


新文件
表，表td{
边框：1px实心；
}
1234
5678
9101112
131415
$（文档）.ready（函数（）{
$（'table td'）.mouseover（函数（）{
如果（$（this）.selected！='X'）
$（this.css（{'background-color'：'#ffff66'}）；
});
$（'table td'）.mouseout（函数（）{
如果（$（this）.selected！='X'）
$（this.css（{'background-color'：'#fff'}）；
});
$（'table td'）。单击（函数（）{
$（this.css（{'background-color'：'#6666ff'}）；
$（this.selected='X'；
});
});

发生“单击”后，必须解除“鼠标悬停”和“鼠标悬停”的绑定

你的点击处理程序应该是这样的-

 $('table td').click(function(){
    $(this).css({'background-color':'#6666ff'});       
    $(this).unbind('mouseout');
    $(this).unbind('mouseover');
   });

或者像这样更好-

$('table td').click(function(){
    var td = $(this);
    td.css({'background-color':'#6666ff'});       
    td.unbind('mouseout');
    td.unbind('mouseover');
   });

$(this)[0].selected='X'

更多关于解除绑定的信息

也就是说，如果像这样设置并访问索引为零的“selected”，代码仍然可以工作-

$('table td').click(function(){
    var td = $(this);
    td.css({'background-color':'#6666ff'});       
    td.unbind('mouseout');
    td.unbind('mouseover');
   });

$(this)[0].selected='X'

$（此）

每次都返回一个新的数组对象。

谢谢，它不适合检查变量（在我选择的情况下）吗？？