上（）不綁定功能在我的情況下工作

Question

這是工作

$("#closePreviewPhoto" + filesId).on('click',function(){ 
     $('#list' + filesId).html(""); 
     $('#files' + filesId).val(""); 
     $('.thumb-canvas' + filesId).css('display','none'); 
     }); 

，但它不工作時，我試圖分開它，並使用功能：

function removePhoto(filesId){ 
    $('#list' + filesId).html(""); 
    $('#files' + filesId).val(""); 
    $('.thumb-canvas' + filesId).css('display','none'); 
} 

$("#closePreviewPhoto" + filesId).on('click', removePhoto(filesId)); 

哪裏是我的錯誤？

Answer 1

您呼叫的功能通過由它返回的值（在這種情況下未定義）作爲事件處理程序，而不是把它當作一個事件處理程序

$("#closePreviewPhoto" + filesId).on('click', function(){ 
    removePhoto(filesId) 
}); 

而且參數filesId看起來像一個封閉變量，如果你可以分享更多的上下文來解決問題，我們可以有更好的看看

Answer 2

你正在傳遞函數調用的結果而不是函數。

變化

$("#closePreviewPhoto" + filesId).on('click', removePhoto(filesId)); 

到

$("#closePreviewPhoto" + filesId).on('click', function(){ 
    removePhoto(filesId) 
}); 

現在，請注意，可能有一個更簡單的解決方案，而不是遍歷所有的filesId綁定的功能，你可以做直接對所有的綁定匹配元素並從點擊元素中推導出filesId id：

$("[id^=closePreviewPhoto]").on('click', function(){ 
    var filesId = this.id.slice("closePreviewPhoto".length); 
    $('#list' + filesId).html(""); 
    $('#files' + filesId).val(""); 
    $('.thumb-canvas' + filesId).css('display','none'); 
});