与超链接使用jQuery

Question

更换一些值

我有以下的html代码：

<table id="MatrixTable"> 
    <tr> 
     <td id="321"> 0 </td> 
    </tr> 
</table 

答：我如何可以替换的超链接的“0”文本时，鼠标悬停使用jQuery像下面这样：

<table id="MatrixTable"> 
    <tr> 
     <td id="321"> 
      <a class="modal-dialog-link" href="Edit?matrixID=321" updatefunction="UpdateMatrix"> 
       0 
      </a> 
     </td> 
    </tr> 
</table> 

$("table#MatrixTable td").mouseover(function() { 
    // doing something here... 
}); 

B.我怎么能回到原来的“0”时，鼠标离开与jQuery像下面这样：

$("table#MatrixTable td").mouseleave(function() { 
    // doing something here... 
}); 

钍anks。

Answer 1

您可以使用hover绑定的事件处理程序mouseenter和mouseleave事件，您可以使用wrap和unwrap包裹在a元素的内容：

​$("#321").hover(function() { 
    $(this).contents().wrap("<a>"); 
}, function() { 
    $(this).find("a").contents().unwrap(); 
});​​​​​ 

这是working example。检查DOM，将鼠标悬停在元素上以查看更改。

这似乎是一个非常奇怪的方式来使用链接虽然......为什么不能链接总是在DOM中？

Answer 2

使用jQuery.hover

$("table#MatrixTable #321").hover(function() { 
    $(this).html('<a class="modal-dialog-link" href="Edit?matrixID=321"'+ 
      'updatefunction="UpdateMatrix">0</a>'); 
},function(){ 
    $(this).text('0'); 
});