jQuery實例覆蓋彼此

Question

我有上面的代碼，運行並更改圖標加載圖標，然後如果其成功的話，其他圖標。無論如何，它在單一實例上絕對正常;然而，當我點擊兩個（或更多）例如，它將離開第一個實例加載圖標，然後最後一個實例會更改其圖標兩次。

我想我明白髮生了什麼，那就是我的變量正在被新值覆蓋。我該如何解決？不應該每個函數的實例都有自己的一組變量？現在看來，變量（init_elem，closest_td，closest_tr）是全局變量，因此被覆蓋？

「$（this）」失去了它的上下文，因此我將它分配給變量。 我在jqGrid上使用這個，因此需要.on（），因爲它'正常'不起作用。 我試圖使用$ .proxy;但我從來沒有使用過它，因爲console.log'ing $（this）.html（）顯示對話框html而不是錨html，所以我似乎無法正常工作。

$(document).ready(function() { 
    $("#acquire-dialog").dialog({ 
     autoOpen: false, 
     modal: true 
    }); 
}); 

$(document).on('click','.acquire-confirmation', function(event) { 
    event.preventDefault(); 
    init_elem = $(this); 
    closest_td = $(init_elem).closest("td"); 
    closest_tr = $(init_elem).closest("tr"); 
    process_id = $(this).attr("rel"); 

    $("#acquire-dialog").dialog('option', 'buttons', { 
     "Confirm" : function() { 
      restore_html = $(init_elem).closest("td").html(); 
      $(closest_td).html('<img class="qmark" title="Loading..." src="images/loading.gif">'); 
      $.post(
       'includes/_add_ajax.php', 
       {section: 'acquire_document', process_id: process_id}, 
       function(data){ 
        $("#ajax_notifications").freeow(data.subject,data.message,{classes: [data.type] }); 
        if (data.type == 'success') 
        { 
         $(closest_tr).find("div:first") 
          .removeClass('icon_status_0') 
          .addClass('icon_status_2') 
          .attr('title','You have acquired access to this document.'); 
         if (typeof data.status !== "undefined") 
         { 
          var document_status = ['A','B','C']; 

          $(closest_td).prev().html(document_status[data.status]); 
          if (data.status == 1) 
           $(closest_td).html('<a class="qmark" target="_blank" title="Generate a return for this document." href="includes/generate_return.php?id='+ process_id +'"><img src="images/icon_pdf.png" border="0" /></a>'); 
          else 
           $(closest_td).html('<img class="qmark" title="You can only generate a return for a document once its been served or a return of non-service has been issued." src="images/icon_question.png">'); 
         } 
        } 
        else 
         $(init_elem).closest("td").html(restore_html); 
       }, 
       'json' 
      ); 
      $(this).dialog("close"); 
     }, 
     "Cancel" : function() { 
      $(this).dialog("close"); 
     } 
    }); 

    $("#acquire-dialog").dialog("open"); 

}); 

這是香港專業教育學院的問候$ .proxy（）嘗試：

$.proxy($("#acquire-dialog").dialog("open"),this); 

和

$.proxy($("#acquire-dialog").dialog("open"),$(this)); 

，最後該事件綁定爲好，但我不認爲這是對的：

$(document).on('click','.acquire-confirmation', $.proxy(function(event) { ... },this)); // and $(this) 

Answer 1

您應該使用var關鍵字變量可能會被覆蓋

您可以瞭解在JavaScript變量的作用域這裏 What is the scope of variables in JavaScript?