jquery düzgün sonra çalışmıyor. html yeniden

3 Cevap php

Ben başlangıçta bir include_once('show_calendarV2.php'); hattan yüklenen öğelerin bir listesini içeren bir sayfa var.

Her öğenin yanına db gelen öğeyi silin ve sonra sayfanızı güncellemek için aşağıdaki jquery tetikleyen bir silme simgesi.

$('.delete_schedule_item').click( function() {
     var id = $(this).next('input[type=hidden]').attr('value');
     alert ( id );

     $.ajax({
          url: 'ajax/delete_schedule_item.php',
          type: 'post',
          data: { id: id },
          dataType: 'json', // get back status of request in JSON
          success: function(data) 
    	  {
    		  //alert( 'item deleted' );
    	  }
         //           if (data.status) {
         //			   alert('success');
         //          }
         //          else {
         //				alert('error');
         //			},
         //... other parameters/callbacks ...
         });

     $.get('show_calendarV2.php', {},      
        function(data) 
        {
    	//load the calendar data
    	$("#calendar").html( data );

       });
    });

Everything works fine the first time an item is deleted. The item is deleted. The new page loads.

Ama sayfadan sonra silme düğmeleri yükler? jquery çağırır? artık işlevi.

Aynı sayfa ilk gösteriminin yanı sıra tazelenmiş bir kod başarısız neden bu kadar emin değilim oluşturmak için kullanılır.

Fikirler?

3 Cevap

Değiştirmeyi deneyin

$('.delete_schedule_item').click(function() {

karşı

$('.delete_schedule_item').live("click", function() {

If you load a bunch of new html, the function that you ran before wouldn't apply karşıit anymore. And since you're loading it via Ajax, the function isn't executed again once it's done loading.

live() ve jquery die() fonksiyonların güzelliği bu duruma dikkat çekmek olduğunu. Yeni bir şey seçme eşleştiğini yüklendiğinde, yeni elemanlar otomatik olarak güncellenir.

Bir daha çalışmıyor nedeni olay işleyicileri DOM elemanlarının kendileri eklenir olmasıdır. AJAX ile yeni HTML yüklediğinizde, ekli olay işleyicileri ile eski parçaları çıkarılır ve işleyicileri olmadan yeni unsurlar, onların yerine ikame edilmektedir. Iki olası çözümü vardır: Birincisi, size yeni yüklenen HTML işleyicileri yeniden uygulayabilirsiniz. Sadece yükledim HTML üzerinde olay işleyicisi ayarlar kodunu yeniden çalıştırın. Click olayı canlı tarafından ele alınır çünkü bu durumda kullanabileceğiniz diğer seçenek, @ womp ve @ karim79 önermek gibi live olay işleyicileri kullanmaktır.

Onlar her türlü etkinlik için geçerli değildir (işleri tıklayın) ve yayılma (yani, yayılmasını durdurma çalışmaz) düzgün çalışmıyor - canlı işleyicileri ile bazı sınırlamalar vardır unutmayın. Daha fazla bilgi için live için jQuery dokümanlar bakın.

Olay heyet kullanın:

$('.delete_schedule_item').live("click", function() {...

Kullanarak olay heyet live otomatik olarak yeni enjekte elemanları için olay işleyicileri yeniden eklenecektir. Eğer ajax taze içeriğe sahip web sayfasının bir bölümünü değiştirmek zaman olay temsilcisi kullandığınız sürece, 'eski' unsurlara bağlı herhangi bir olay işleyicileri otomatik olarak, yeni enjekte olanlar için yeniden bağlı almazsınız (veya olay işleyici yeniden takmak ajax yöntemin geri arama içinde).

live çalışma ile olay heyet için, jQuery 1.3 veya daha büyük kullanarak gerekir.