Noobie Jquery問題 - 我在腳本中發現了一個錯誤，不知道如何修復它

感謝您對my last noobie jquery question的幫助，既然你做得很好，我還有另一個爲你:)下面的腳本允許我執行一些簡單的AJAX通過從另一個HTML文件中檢索一些靜態標記並將其插入到我的主頁中。我遇到了一個我認爲與異步性魔術有關的錯誤，但由於我是AJAX新手，我不確定。Noobie Jquery問題 - 我在腳本中發現了一個錯誤，不知道如何修復它

當我將鼠標移動到鏈接上時，它會檢索HTML並將其插入到我的主頁中。當我將鼠標移出鏈接時，它應該刪除插入的新HTML。當有時插入HTML時，錯誤就會出現，但是當您非常快速地將鼠標移入/移出鏈接時不會將其刪除。我的理論是在HTML被實際插入之前調用「鼠標關閉」功能，你同意嗎？如果是這樣，關於如何解決這個問題的任何想法？這裏的腳本...

$(function() 
{ 
    //HOVER EFFECT FOR CONTACT LINK 
    $('a#contact_link').hover(function() 
    {   
     $('<div id="contact_container" />').load('contact.htm #contact', function() 
     { 
      $(this).stop() 
       .hide() 
       .insertAfter('#header') 
       .slideDown(250);  
     });  
    }, 
    //MOUSE OFF EFFECT FOR CONTACT LINK 
    function() 
    { 
     $('#contact_container').remove();  
    });  
});

非常感謝您的幫助！

編輯*感謝您的答覆，我改變了我的腳本和錯誤似乎是固定的...

$(function() 
{ 
    //RETRIEVE THE MARKUP AT PAGE LOAD 
    $('<div id="contact_container" />').load('contact.htm #contact', function() 
    { 
     $(this).hide() 
      .insertAfter('#header'); 
    }); 

    //HOVER EFFECT FOR CONTACT LINK, SHOW THE MARKUP 
    $('a#contact_link').hover(function() 
    {   
     $('#contact_container').stop() 
      .slideDown(250);    
    }, 
    //MOUSE OFF EFFECT FOR CONTACT LINK, HIDE THE MARKUP 
    function() 
    { 
     $('#contact_container').stop() 
      .hide();   
    });  
});

我仍然可以看到潛力，在此腳本中一些錯誤，但我將另存爲另一個問題;）謝謝大家！

來源

2009-08-21 BeachRunnerFred

爲什麼不只填充一次內容並在鼠標不存在時隱藏div。如果div中存在DOM，則再次調用懸停時，只需更改div的可見性即可。

每次用Ajax響應加載div都不是一個好主意，如果得到的響應是相同的。

if ($("#contact_container").length > 0){ 
    // the element exits in the DOM 
}

來源

2009-08-21 06:41:30 rahul

他使用GET請求，因此將被緩存 – redsquare 2009-08-21 06:42:30

但同意在鼠標懸停不會是一個很好的經驗 – redsquare 2009-08-21 06:43:18

很好的提示一個XHR，我會嘗試這個，謝謝！ – BeachRunnerFred 2009-08-21 06:44:35

這聽起來沒錯。

解決此問題的一種可能方法是在ajax調用成功時設置一個標誌，指示已插入內容。然後，在懸停功能中，檢查是否已設置標誌，如果有，請調用remove命令。您可以設置一個時間間隔來檢查標誌，直到它被設置。

或者另一種方式 -

在文件準備執行負載，隱藏的內容，然後顯示和隱藏在懸停和出，分別。

順便說一句，您的選擇器將插入一個新的<div>元素與編號contact_container，這是你想要的？

來源

2009-08-21 06:44:11

謝謝，這是一個很好的提示，你說得很好。這是我想要的，但可能不是每次鏈接都被徘徊。 – BeachRunnerFred 2009-08-21 06:50:33

-1

我以爲有人已經回覆in your previous question您的DIV選擇器是錯誤的。你嘗試修復它嗎？

來源

2009-08-21 06:44:33

我的div選擇器在這個腳本中工作正常，這要歸功於我對上一個問題的回覆。 – BeachRunnerFred 2009-08-21 06:48:47

爲什麼不使用mouseleave？

 $("a#contact_link").mouseleave(function(event){ 
      $("a#contact_link").hide("slow"); 
     });

來源

2009-08-21 06:47:34

不會產生與上面相同的行爲嗎？ – BeachRunnerFred 2009-08-21 06:55:47

不確定。我也是jquery新手。但它爲我工作... – 2009-08-21 06:57:27

Noobie Jquery問題 - 我在腳本中發現了一個錯誤，不知道如何修復它

回答

相關問題