@B1ackGh0st

Почему не работают функции jQuery для подгружаемого контента?

Здрасте.

Есть функция для вывода таблицы через AJAX
$(function() {
  $('#getShelving').click(function(){
    $.ajax({
      url: "ajax/echoShelving.php",
      cache: false,
      success: function(html){
	$("#resultshelvingAdd").html(html);
      }
    });
        $.ajax({
      url: "ajax/echoStorageOption.php",
      cache: false,
      success: function(html){
	$("#resultechoCtorageOption").html(html);
      }
    });
  });
});


и функция удаления этих строк

$(function() {
$('.delShelving').on('click', function() {
  if(confirm("Вы уверенны что хотите удалить?"))	{
   $('#load').fadeIn();
    $(this).parent();
    var id = $(this).attr("id");
    $.post("ajax/delShelving.php",{id : id},AjaxSuccess);
    $(this).parent().slideUp('slow', function() {$(this).remove();});
    // Вывод соощения о успешном удалении строки
    function AjaxSuccess(data)
    {
      alert("Удалено");
      //$('#otvet').html(data);
    }
    return false;
  }
});
});


проблема в том что после вывода таблицы функция для удаления строк не работает
  • Вопрос задан
  • 4268 просмотров
Пригласить эксперта
Ответы на вопрос 2
evnuh
@evnuh
Поиск Гугл помог мне, впусти и ты его в свой дом
$('.delShelving').on('click', function() {
// меняем на 
$(document).on('click', '.delShelving', function() {

и пробуем. Должно теперь заработать.

А дальше идём в гугл, оттуда попадаем на сайт jQuery на странику метода .on() и читаем что такое Direct and delegated events и как они баблятся (bubble) наверх по DOM дереву.
Ответ написан
iiil
@iiil
Инженер и вэб-дизайнер, рисую.
Почитайте про прямую и делегированную обработку, используйте

$('parent').on('click', 'child', function(){ //... });
// parent — ближайший родитель, который не добавляется динамически
// child — Ваш элемент, на который Вы навешиваете событие click, т. е. '.delShelving'
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы