Аякса очистить, если это возможно по представить

Question

я этот кусок кода, который наконец-то работает для меня

$(function(){ 
     $('.submit1').click(function(){ 
      $.ajax({ 
       type: "POST", 
       url: "delanno.php", 
       data: $("#myform1").serialize(), 
       beforeSend: function(){ 
        $('#result').html('<img src="images/loading.gif" />'); 
       }, 
       success: function(data){ 
        $('#result').html(data); 
       } 
      }); 
     }); 
     $('.deleter').on('click', function(){ 
      $(this).closest('.announce-box').remove(); 
     }) 
    }); 

    $(function(){ 
     $('.submit2').click(function(){ 
      $.ajax({ 
       type: "POST", 
       url: "delanno.php", 
       data: $("#myform2").serialize(), 
       beforeSend: function(){ 
        $('#result').html('<img src="images/loading.gif" />'); 
       }, 
       success: function(data){ 
        $('#result').html(data); 
       } 
      }); 
     }); 
     $('.deleter').on('click', function(){ 
      $(this).closest('.announce-box').remove(); 
     }) 
    }); 
     $(function(){ 
     $('.submit3').click(function(){ 
      $.ajax({ 
       type: "POST", 
       url: "delanno.php", 
       data: $("#myform3").serialize(), 
       beforeSend: function(){ 
        $('#result').html('<img src="images/loading.gif" />'); 
       }, 
       success: function(data){ 
        $('#result').html(data); 
       } 
      }); 
     }); 
     $('.deleter').on('click', function(){ 
      $(this).closest('.announce-box').remove(); 
     }) 
    }); 

возможно объединить все 3 комплекта в 1 кусок кода?

Answer 1

Я предполагаю, что кнопки не имеют какие-либо другие классы, и если да, вы можете получить последнюю цифру с this.className.slice(-1) и нацелены на все кнопки с одним обработчиком событий и использовать последнюю цифру, чтобы получить правильную форму:

$(function(){ 
    $('[class^="submit"]').on('click', function() { 
     var n = this.className.slice(-1); 
     $.ajax({ 
      type : 'POST', 
      url : 'delanno.php', 
      data : $('#myform' + n).serialize(), 
      beforeSend: function(){ 
       $('#result').html('<img src="images/loading.gif" />'); 
      } 
     }).done(function(data) { 
      $('#result').html(data); 
     }); 

     $('.deleter').on('click', function(){ 
      $(this).closest('.announce-box').remove(); 
     }); 
    }); 
}); 

как предложено в комментариях, если кнопки представить внутри соответствующих форм, вы должны использовать фактические кнопки отправки и поймать представить событие, а не событие щелчка на кнопке:

$(function(){ 
    $('[id^="myform"]').on('submit', function(e) { 
     e.preventDefault(); 
     $.ajax({ 
      type : 'POST', 
      url : 'delanno.php', 
      data : $(this).serialize(), 
      beforeSend: function(){ 
       $('#result').html('<img src="images/loading.gif" />'); 
      } 
     }).done(function(data) { 
      $('#result').html(data); 
     }); 

     $('.deleter').on('click', function(){ 
      $(this).closest('.announce-box').remove(); 
     }); 
    }); 
}); 

Answer 2

Да , это должно быть ...

post = function (ele) { 
    $.ajax({ 
     type: "POST", 
     url: "delanno.php", 
     data: $(ele).serialize(), 
     beforeSend: function() { 
      $('#result').html('<img src="images/loading.gif" />'); 
     }, 
     success: function (data) { 
      $('#result').html(data); 
     } 
    }); 
}; 

$(function() { 
    $('.submit1').on('click', post($('#submit1'))); 
    $('.submit2').on('click', post($('#submit2'))); 
    $('.submit3').on('click', post($('#submit3'))); 
    $('.deleter').on('click', function() { 
     $(this).closest('.announce-box').remove(); 
    }); 
});