Javascript事件進入無限循環

我需要能夠在mouseover上動態創建超鏈接並在mouseout事件中將其刪除。但是，當鼠標移過鏈接時，我需要它到而不是的行爲就好像它是鼠標移出。發生這種情況時，事件進入無限循環。請參閱以下示例：Javascript事件進入無限循環

<html> 
<head><title> 
</title></head> 
<body> 
    <script language="javascript" type="text/javascript"> 
     function showEdit(tcell) { 
      var editTag = document.createElement('a'); 
      editTag.appendChild(document.createTextNode("test2")); 
      editTag.setAttribute('name', 'test2'); 
      editTag.setAttribute('id', 'lnkEdit'); 
      editTag.setAttribute('href', '#'); 
      editTag.setAttribute('style', 'float:right;'); 
      tcell.appendChild(editTag); 
     } 
     function hideEdit(tcell) { 
      //var tcell = document.getElementById("tcAdd"); 
      var lnk = document.getElementById("lnkEdit"); 
      tcell.removeChild(lnk); 
     } 
    </script> 
    <div> 
     <table style="width:200px;"> 
      <tr> 
       <td id="tcAdd" style="border:1px solid #CCC" onmouseover="showEdit(this);" onmouseout="hideEdit(this);"> 
        <a href="#">test1</a> 
       </td> 
      </tr> 
     </table> 
    </div> 
</body> 
</html>

將光標置於test1和test2上以查看差異。我想我錯過了一些明顯的東西。

感謝

來源

2012-01-05 Samuel

可能重複的[防止onmouseout當懸停父絕對div的子元素]（http://stackoverflow.com/questions/4697758/prevent-onmouseout -when-hovering-child-element-of-parent-absolute-div） – 2012-01-05 16:28:33

謝謝你看看那個 – Samuel 2012-01-05 16:38:31

好了，我不知道，如果你想這樣，但它的工作原理：

<html> 
<head><title> 
</title></head> 
<body> 
    <script language="javascript" type="text/javascript"> 
     function showEdit(tcell) { 
      document.getElementById("lnkEdit").style.display="inline"; 
     } 
     function hideEdit(tcell) { 
      document.getElementById("lnkEdit").style.display="none"; 
     } 
    </script> 
    <div> 
     <table style="width:200px;"> 
      <tr> 
       <td id="tcAdd" style="border:1px solid #CCC" onmouseover="showEdit(this);" onmouseout="hideEdit(this);"> 
        <a href="#">test1</a> 
        <a href="#" id="lnkEdit" style="float: right; display:none">test2</a> 
       </td> 
      </tr> 
     </table> 
    </div> 
</body> 
</html>

這比使用DOM簡單的方法。但如果你想使用DOM，我可以再試一次=）

來源

2012-01-05 17:11:56

你傳遞給函數的第二個參數是什麼？我沒有看到被使用。 – 2012-01-05 18:35:02

@JamesMontagne你是對的！當我測試並忘記刪除時，我使用了它。謝謝。 – 2012-01-05 18:38:47

這個想法不是使用第二個錨作爲靜態標籤。這是因爲頁面有很多這樣的內容，並且通過動態地執行，我可以減少頁面的加載時間。 – Samuel 2012-01-05 20:56:22

Javascript事件進入無限循環

回答

相關問題