jquery $ (event.target) .closest ('td') теряется при вызове одной и той же функции более одного раза в одно и то же время.

Question

У меня проблема с приведенным ниже кодом, и я не уверен в причине.

Краткое описание сценария:
В основном у меня есть страница с несколькими полями ввода для встроенногопри каждом заполнении каждого из них, при размытии или нажатии клавиши ввода, вызывается функция javascript, которая выполняет следующие действия:

• показывает «загрузку» вместо поля ввода
• делаетAJAX-запрос к PHP-файлу
• по завершении, а затем заменяет «загрузку» значением пользователя

Проблема :
Выше работает отличнохорошо, если пользователь редактирует 1 поле ввода за раз, но когда пользователь редактирует 2-е поле, в то время как первое все еще «загружается», javascript теряется, а когда 1-й запрос AJAX завершается, «загрузка» по-прежнемувсегда там, но на втором он корректно заменен.

Ниже приведен код javascript, я считаю, что путаница JS связана с «nearTd», это как если бы jquery «забыл» старый nearTd(из первого вызова), и только «запоминает» новый ... любые предложения, пожалуйста?

function action_addSystemCountryLanguageField (event) {
value = $(event.target).val();
nearestTd = $(event.target).closest('td');
var loading=nearestTd.html("<div align='center'><img src='images/loading-small.gif' width='15' height='15' /></div>");

$.ajax({
    url: 'actions/pause.php',
    type: 'POST',
    dataType: 'json',
    success: function(response, textStatus, XMLHttpRequest) {
        nearestTd.html("<span class='editSystemCountryLanguage'>ok</span>");
    },
    error: function(XMLHttpRequest, textStatus, errorThrown) {
        if (typeof console != 'undefined')
            console.dir(XMLHttpRequest);
        return false;
    }
});
}

PHP-код, просто простая функция паузы, чтобы я мог иметь задержку AJX и проверить эту ошибку:

<?php
  sleep(1.5);
?>

код на странице и jQuery 'слушатель':

$(".addSystemCountryLanguage").live('blur', action_addSystemCountryLanguageField);
$(".addSystemCountryLanguage").keypress(function(e) {
  if(e.keyCode == 13) {
    action_addSystemCountryLanguageField(e);
  }
});

HTML:

<input class='addSystemCountryLanguage' style='width:80px;  border: 0;' value='' />

Answer 1

Вы случайно используете глобальные переменные.

function action_addSystemCountryLanguageField (event) {
  var value = $(event.target).val();
  var nearestTd = $(event.target).closest('td');
  var loading=nearestTd.html("<div align='center'><img src='images/loading-small.gif' width='15' height='15' /></div>");

  .
  .
  .
}

http://www.jslint.com/ иногда также будет сталкиваться с подобными проблемами для вас.