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?