功能行爲與硬編碼

不同，並提前抱歉，我不知道我遇到的問題的術語。本質上講，這硬編碼版本按預期工作：功能行爲與硬編碼

$("#navbar").on("click", "#contactLink", loadContact); 

function loadContact() { 
    $("#navbar ul li a").removeClass("selected"); 
    $("#contactLink").addClass("selected"); 
    $("#page").fadeOut(500, function(){ 
     $("#content").load("TGCContact.html .insert", function() { 
      $("#page").fadeIn(1000); 
     }); 
    }); 
    return false; 
}

但低於版本暫停了500毫秒（包括「選擇」鏈接更新）然後清空＃內容，並直接跳轉到淡入（）：

$("#navbar").on("click", "#contactLink", function(){ 
    loadContact('TGCContact.html .insert', '#contactLink'); 
}); 

function loadContact (htmlPage, newLink) { 
    $("#navbar ul li a").removeClass("selected"); 
    $(newLink).addClass("selected"); 
    $("#page").fadeOut(500, function(){ 
     $("#content").load(htmlPage, function() { 
      $("#page").fadeIn(1000); 
     }); 
    }); 
    return false; 
}

硬編碼版本不錯而且流暢。有人可以解釋爲什麼會發生這種情況，以及如何解決它？謝謝

來源

2014-09-04 user3732322

你能爲此設置一個小提琴嗎？ – 2014-09-05 00:08:37

以500作爲參數的fadeOut調用可能與此有關...... – Jay 2014-09-05 00:08:53

經過多一點研究後，似乎是傳遞函數調用而不是函數引用的問題。難道是在第二個例子中loadContact函數被調用？它似乎傳遞函數（）{loadContact（...）;}是一個有效的參考。 – user3732322 2014-09-05 00:21:13

唯一我在第二個版本中看到錯誤的是，你失去了return false預期的效果，這是爲了防止默認行爲（event.preventDefault()通常更適合）。

因此，如果沒有HTML，可以假設有一個URL，頁面會做一些可能導致不需要的效果的東西。

所以，你可以返回被調用函數本身

$("#navbar").on("click", "#contactLink", function(){ 
    return loadContact('TGCContact.html .insert', '#contactLink'); 
});

的結果

或者乾脆失去功能return false，做它在處理程序

$("#navbar").on("click", "#contactLink", function(){ 
    loadContact('TGCContact.html .insert', '#contactLink'); 
    return false; 
});

event.preventDefault方式

$("#navbar").on("click", "#contactLink", function(event){ 
    loadContact('TGCContact.html .insert', '#contactLink'); 
    event.preventDefault(); 
});

來源

2014-09-05 00:32:54 GillesC

謝謝Gillesc！第二個在loadContact（）函數外部帶有'return false'的例子實現了這個功能。我也想停止傳播，因爲我在導航欄上有監聽器，所以在這種情況下返回false是可以的。 – user3732322 2014-09-05 00:51:43

功能行爲與硬編碼

回答

相關問題