需要重新啓用onclick事件中禁用的onmouseout事件

我在此處和Internet上搜索了可重新啓用onClick代碼中禁用的onMouseOut的代碼。我發現了一些東西，但沒有任何東西適用於我的情況。需要重新啓用onclick事件中禁用的onmouseout事件

在頁面上有一個容器div，它包含兩個div，一個用於圖像，另一個用於相應的文本。圖片下方是四個鏈接（1,2,3,4），以無序列表形式排列。當訪問者瀏覽＃2時，圖像需要更改爲img2，匹配的文本div需要從「隱藏」轉到「顯示」。 onMouseOut將圖像和文本重置爲原始版本。 onClick將圖像/文本更改爲任何＃被點擊，然後禁用onMouseOut。

現在我需要一種方法來讓onMOuseOut在下次訪問該鏈接時再次運行。就像我現在一樣，一旦onMouseOut被禁用，它將保持禁用狀態，直到我重新加載頁面。

這裏是到目前爲止的代碼：

<head> 
<script> 
if (document.images) { 
book1 = new Image 
    book2 = new Image 
    book3 = new Image 
    book4 = new Image 

book1.src = "/llb/assets/book1.jpg" 
    book2.src = "/llb/assets/book2.jpg" 
book3.src = "/llb/assets/book3.jpg" 
    book4.src = "/llb/assets/book4.jpg" 
} 
function swapImage(thisImage,newImage) { 
if (document.images) { 
    document[thisImage].src = eval(newImage + ".src") 
} 


} 
function show_visibility(IDS){ 
hide_visibility(); 
document.getElementById(IDS).style.display = 'block'; 
} 

function hide_visibility(){ 
var sel = document.getElementById('bookleadin').getElementsByTagName('div'); 
for (var i=0; i<sel.length; i++) { sel[i].style.display = 'none'; } 

} 

</script> 
</head> 

<body> 

<div id="content"> 
    <div id="books"> 
     <div id="bookimages"> 
     <img id="bookcover" name="bookcover" src="../llb/assets/book1.jpg" /> 
     <ul> 
      <li><a href="#" onclick="swapImage('bookcover','book1'); show_visibility('bt1'); this.onmouseout=''" onMouseOver="swapImage('bookcover','book1')" onMouseOut="swapImage('bookcover','book1')">1</a></li> 
      <li><a href="#" onclick="swapImage('bookcover','book2'); show_visibility('bt2'); this.onmouseout=''" onMouseOver="swapImage('bookcover','book2')" onMouseOut="swapImage('bookcover','book1')">2</a></li> 
      <li><a href="#" onclick="show_visibility('bt3'); swapImage('bookcover','book3')" onMouseOver="swapImage('bookcover','book3')" onMouseOut="swapImage('bookcover','book1')" onclick="swapImage('bookcover','book3')">3</a></li> 
      <li><a href="#" onclick="show_visibility('bt4'); swapImage('bookcover','book4')" onMouseOver="swapImage('bookcover','book4')" onMouseOut="swapImage('bookcover','book1')" onclick="swapImage('bookcover','book4')">4</a></li> 
     </ul> 
     </div><!-- end bookimages --> 
     <div id="bookleadin"> 
     <div id="bt1" style="display:block;"><p>Writing starts with living...</p> 
     </div> 
     <div id="bt2" style="display:none;"><p>The air is silk...</p> 
     </div> 
     <div id="bt3" style="display:none;"><p>I lived in the woods...</p> 
     </div> 
     <div id="bt4" style="display:none;"><p>I tried to forget...</p> 
     </div> 
    </div><!-- end bookleadin --> 
    <div class="spacer"></div> 
    </div><!-- ends books --> 
</div><!-- end content -->

列表項＃2是我與測試的例子。我仍然是一個JavaScript初學者/中級，所以任何答案都必須足夠簡單，以便我理解和應用到此項目或完成，以便我可以複製/粘貼它。

非常感謝您提供任何幫助。

來源

2012-01-05 ssliver1

你可以設置一個標誌onclick被驗證，如果它已被點擊，如果是的話，然後做交換onmouseout別的什麼都不做，但是沒有做this.onmouseout = ""。

編輯：

<head> 
<script> 
    if(document.images) { 
     book1 = new Image 
     book2 = new Image 
     book3 = new Image 
     book4 = new Image 

     book1.src = "/llb/assets/book1.jpg" 
     book2.src = "/llb/assets/book2.jpg" 
     book3.src = "/llb/assets/book3.jpg" 
     book4.src = "/llb/assets/book4.jpg" 
    } 
    var swap_list = {}; // a list of swapped elements 
    function swapImage(thisImage, newImage) { 
     if(typeof swap_list[thisImage] == 'undefined' || swap_list[thisImage]=='') 
      if(document.images) { 
       document[thisImage].src = eval(newImage + ".src"); 
       swap_list[thisImage] = newImage; 
      } 
     else 
      { 
       swap_list[thisImage] = ''; 
       document[thisImage].src = "../llb/assets/book1.jpg"; 
      } 
    } 

    function show_visibility(IDS) { 
     hide_visibility(); 
     document.getElementById(IDS).style.display = 'block'; 
    } 

    function hide_visibility() { 
     var sel = document.getElementById('bookleadin').getElementsByTagName('div'); 
     for(var i = 0; i < sel.length; i++) { 
      sel[i].style.display = 'none'; 
     } 

    } 
</script> 
</head> 
<body> 
    <div id="content"> 
     <div id="books"> 
      <div id="bookimages"> 
       <img id="bookcover" name="bookcover" src="../llb/assets/book1.jpg" /> 
       <ul> 
       <li> 
         <a href="#" onclick="swapImage('bookcover','book1'); show_visibility('bt1'); " onMouseOver="swapImage('bookcover','book1')" onMouseOut="swapImage('bookcover','book1')">1</a> 
       </li> 
       <li> 
        <a href="#" onclick="swapImage('bookcover','book2'); show_visibility('bt2'); " onMouseOver="swapImage('bookcover','book2')" onMouseOut="swapImage('bookcover','book1')">2</a> 
       </li> 
       <li> 
        <a href="#" onclick="show_visibility('bt3'); swapImage('bookcover','book3')" onMouseOver="swapImage('bookcover','book3')" onMouseOut="swapImage('bookcover','book1')" onclick="swapImage('bookcover','book3')">3</a> 
       </li> 
       <li> 
        <a href="#" onclick="show_visibility('bt4'); swapImage('bookcover','book4')" onMouseOver="swapImage('bookcover','book4')" onMouseOut="swapImage('bookcover','book1')" onclick="swapImage('bookcover','book4')">4</a> 
       </li> 
      </ul> 
     </div><!-- end bookimages --> 
     <div id="bookleadin"> 
      <div id="bt1" style="display:block;"> 
       <p> 
        Writing starts with living... 
       </p> 
      </div> 
      <div id="bt2" style="display:none;"> 
       <p> 
        The air is silk... 
       </p> 
      </div> 
      <div id="bt3" style="display:none;"> 
       <p> 
        I lived in the woods... 
       </p> 
       </div> 
       <div id="bt4" style="display:none;"> 
        <p> 
        I tried to forget... 
        </p> 
      </div> 
      </div><!-- end bookleadin --> 
      <div class="spacer"></div> 
     </div><!-- ends books --> 
    </div><!-- end content --> 
</body>

來源

2012-01-06 00:31:34 khael

讓我改一下，看看是否我理解你。我會寫一個函數來確定onClick是否發生。如果爲true，我將禁用onMouseOut，如果爲false，它將不會觸及onMouseout，因此當光標移出鏈接並且原始內容重新出現時，它仍會發生。我從哪裏調用驗證函數？我將使用什麼代碼來禁用onMouseOut事件，並且一旦用戶懸停或點擊不同的鏈接，我將如何將該鏈接重新打開？ – ssliver1 2012-01-06 04:40:13

@ ssliver1你不禁止onmouseout，你只是驗證它，如果onclick發生，如果它沒有做別的你的代碼。你需要一些代碼還是純算法的邏輯足夠了？ – khael 2012-01-06 04:49:55

也許我需要一些代碼。我被困在試圖找出什麼時候/在哪裏我會觸發檢查onclick檢查。每個鏈接都有三個事件，mouseOver，mouseOut和onCLick。如果他們點擊鏈接，我需要mouseOut什麼也不做。如果他們不點擊，我需要mouseOut來完成一個動作。感謝您的幫助。 – ssliver1 2012-01-09 15:42:24

需要重新啓用onclick事件中禁用的onmouseout事件

回答

相關問題