jQuery Ajax скрипты выбивают друг друга

Question

У меня есть небольшая проблема с моим кодом. Я хочу сделать сайт на основе ajax, где вам не нужно обновлять страницу. Но два js выбивают друг друга или что-то не так, потому что я могу войти в систему, но когда я пытаюсь выйти из системы, ничего не происходит, но если я обновляюсь (и я все еще зарегистрирован), я могу выйти из системы, но теперь, когда появляется форма входа Я не могу войти. Вот мой код javascript.

$(document).ready(function() { 
    $(".login").click(function() { 
     var dataString = $("#loginform").serialize(); 
     $.ajax({ 
      type: "POST", 
      url: "checklogin.php", 
      data: dataString, 
      cache: false, 
      success: function(html) { 
       $("#pirossavon").html(html); 
       $('#content').load(document.URL + ' #content'); 
      } 
     }); 

    }); 
}); 


$(document).ready(function() { 
    $(".logout").click(function() { 

     $.ajax({ 
      type: "POST", 
      url: "checklogin.php", 
      data: "logout=1", 
      cache: false, 
      success: function(html) { 
       $("#pirossavon").html(html); 
       $('#content').load(document.URL + ' #content'); 
      } 
     }); 

    }); 
}); 

Как вы можете видеть, после успеха AJAX, я перегрузочный заголовок (где форма Логина и деталь, если вы входите в системе) и содержание ДИВА моего сайта.

Answer 1

Являются ли оба тега сценария внутри документа до того, как сделаны какие-либо вызовы AJAX?

Проблема может заключаться в том, что вы не используете delegated events.

$(document).ready(function() { 
 
    $(document).on('click', '.login', function() { 
 

 
    // AJAX 
 

 
    }); 
 
}); 
 

 
$(document).ready(function() { 
 
    $(document).on('click', '.logout', function() { 
 

 
    // AJAX 
 

 
    }); 
 
});

Поскольку кнопка выхода нет до входа в систему, вы будете обработчик события не привязан к какой-либо объект. После обновления событие добавляется, но теперь кнопка входа в систему не имеет обработчика событий. Таким образом, вы можете выйти из системы, но теперь вы не можете войти в систему. Присоединение события к документу (или любой родитель из обеих кнопок, которые не будут заменены во время вызова AJAX, было бы неплохо) и делегирование его соответствующей кнопке , ваши обработчики событий подключены, даже если одна из кнопок отсутствует в документе еще.

Надеюсь, это поможет!