將匿名函數轉換爲命名函數的JQuery不能正常工作

我有一個js文件，其中一個$(document).ready..塊。由於這個塊內有很多匿名函數，我決定移動它們並創建函數。問題在於，當我將匿名函數更改爲函數時，js停止正常工作。將匿名函數轉換爲命名函數的JQuery不能正常工作

在這種情況下，我試圖創建一個destination_from_0_changed函數來避免匿名。

例如：

BEFORE（作品）

$(document).ready(function() { 
    var destination_from_0 = $("#id_form-0-destination_from"); 
    var destination_to_0 = $('#id_form-0-destination_to'); 
    destination_from_0.on('change', function() { 
     var destination_id = $(this).val(); 
     if (destination_id==''){ 
      return; 
     } 
     var ajax_loading_image = $('#ajax-loading-image'); 
     destination_to_0.empty(); 
     ajax_loading_image.show(); 
     $.ajax({ 
      url: '/ajax/get-destination-to-options/' + destination_id + '/', 
      success: function (data) { 
       ajax_loading_image.hide(); 
       destination_to_0.append('<option value="" selected="selected">'+"---------" + '</option>'); 
       $.each(data, function (key, value) { 
        destination_to_0.append('<option value="' + key + '">' + value + '</option>'); 
       }); 
       destination_to_0.change(); 
      } 
     }) 
    });

NOW：（不工作）

$(document).ready(function() { 
    var destination_from_0 = $("#id_form-0-destination_from"); 
    var destination_to_0 = $('#id_form-0-destination_to'); 
    destination_from_0.on('change', function(){ 
     destination_from_0_changed(destination_to_0); 
    }); 

function destination_from_0_changed(destination_to_0){ 
    var destination_id = $(this).val(); 
     if (destination_id==''){ 
      return; 
     } 
     var ajax_loading_image = $('#ajax-loading-image'); 
     destination_to_0.empty(); 
     ajax_loading_image.show(); 
     $.ajax({ 
      url: '/ajax/get-destination-to-options/' + destination_id + '/', 
      success: function (data) { 
       ajax_loading_image.hide(); 
       destination_to_0.append('<option value="" selected="selected">'+"---------" + '</option>'); 
       $.each(data, function (key, value) { 
        destination_to_0.append('<option value="' + key + '">' + value + '</option>'); 
       }); 
       destination_to_0.change(); 
      } 
     }) 
}

你們是否知道問題出在哪裏？

來源

2016-08-02 Milano Slesarik

你'this'已經改變了......你還沒有得到無論如何擺脫匿名函數 –

問題與你的實現是當前元素上下文this不引用調用該事件的元素。

您可以使用bind()

的bind()方法創建一個新的函數，調用它時，有該關鍵字設置爲所提供的價值，與前當新的功能是任何提供的參數給定的順序調用。

代碼

destination_from_0.on('change', function(){ 
    destination_from_0_changed.bind(this)(destination_to_0); 
});

或者，你可以使用.call()

的call()方法調用與給定值this並單獨提供參數的函數。

destination_from_0.on('change', function(){ 
    destination_from_0_changed.call(this, destination_to_0); 
});

來源

2016-08-02 09:16:19 Satpal

或者你可以使用.call來避免那個討厭的語法 –

@JaromandaX，正在更新:) – Satpal

，如果你想獲得完全擺脫匿名函數，您可以更改代碼

destination_from_0.on('change', destination_from_0_changed.bind(destination_from_0, destination_to_0));

來源

2016-08-02 09:25:17

將匿名函數轉換爲命名函數的JQuery不能正常工作

回答

相關問題