點擊 - 優文庫

後鼠標移開時恢復格的內容，我想一個DIV的內容時，這些條件滿足時改變：點擊

的DIV

懸停上方的文字鏈接點擊通過DIV本身

當光標離開div或鏈接時，DIV內容應該恢復到其原始狀態。

我的問題是這樣的：點擊鏈接後DIV內容不會改回原來的和光標移開。 onclick事件似乎否定了onmouseout事件。

如果您有任何建議，請將修改後的代碼發佈到codepen;這將不勝感激！ Here is the code.

<html><head><title>Title</title> 

<SCRIPT LANGUAGE="JavaScript"> 
    function changeContent1() 
    { 
     document.getElementById("myDiv").innerHTML='<a href="#" onmouseout="changeContentBack1()" style="text-decoration:none"><div style="background:black;color:white;width:450px;height:203px">THIS TEXT APPEARS ON CLICK OR ROLLOVER</div>' 
    } 
    </SCRIPT> 

    <SCRIPT LANGUAGE="JavaScript"> 
    function changeContentBack1() 
    { 
     document.getElementById("myDiv").innerHTML='<a href="#" onmouseover="changeContent1()" style="text-decoration:none"><div style="background:red;color:white;width:450px;height:203px">ORIGINAL TEXT</div></a>' 
    } 
    </SCRIPT> 

</head> 
<body> 

    <div style="width:450px;float:left">This is the section title. <a href="#" onclick="changeContent1()"><a href="#" onclick="changeContent1()">Click for more info</a><br><br> 
     <div id="myDiv"><a href="#" onmouseover="changeContent1()" style="text-decoration:none"> 
      <div style="background:red;color:white;width:450px;height:203px">ORIGINAL TEXT 
      </div></a> 
     </div> 
    </div> 
</body> 
</html>

來源

2013-07-11 Colin Goldberg

請在這裏發佈您的代碼。 – j08691

將代碼添加到問題中。 –

有沒有你不使用jQuery的原因？ – caramba