document.ready jQuery AJAX $ _POST?

2 Cevap php

PHP, jQuery ve AJAX öğrenme içine yaklaşık bir hafta yaşıyorum ve hızlı bir şekilde alıyorum. Ben biraz yardıma ihtiyacım var bir açıklama sistemi ile yeni bir video sitesi inşa ediyorum. Site video küçük bir listesini gösterir ve kullanıcı resmini tıkladığında, jquery otomatik olarak doğru video göstermek için bu sayfadaki html değiştirir:

    $(".thumbnailcontainer img").click(function() {

	var yt_vid = $(this).attr("id");

	$("#youtube").fadeOut(300, function() {
		//$("#content").append('<img src="img/design/icons/loading.gif" alt="Currently Loading" id="loading" class="loading" />');
		$("#youtube").replaceWith('<object id="youtube" type="application/x-shockwave-flash" style="width:640px; height:385px; display:none;" data="http://www.youtube.com/v/' + yt_vid + '&hl=en_US&fs=1&hd=1"><param name="movie" value="http://www.youtube.com/v/' + yt_vid + '&hl=en_US&fs=1&hd=1" /><param wmode="transparent"><\/param><\/object>');
		/*$("#loading").fadeOut(500, function() {
			$(this).remove();
		});*/

		$('#youtube').fadeIn(1000);
	});

(Im'm youtube video üstüne gösterilecek yerine bunun altında aşağı itiliyor ... Bu soruya cevap eğer, bonuspoints sizin için nasıl anlamaya çalışıyorum çünkü geçici yükleme simgesini dışarı yorumladı.)

Neyse, videonun gösterildiği, hangi bağlı, ben altında görüntülemek için o video ile ilgili yorumlar için ihtiyaç. Ben yorumları dinamik onclick de değiştirmek istedim, bu yüzden bu kodu oluşturuldu:

    //Send POST data to PHP script to switch to correct comments
//Select Thumbnail's second parent's ID attr on click
	var commentsID = $(this).parents("div:eq(1)").attr("id");

	$.ajax({
		url: 'php/comments.inc.php',
		type: 'POST',
		data: 'commentsID=' + commentsID,
		success: function(html) {
				$('#comments').html(html);
				$("#db").attr("value", '' + commentsID + '');
		}
	});
});

Bu aslında, küçük resim id niteliği gelen MySQL tablo adını kapmak doğru yorum döndüren bir komut dosyası mesajlar onu, ve yorumlarınızı göndermek için hangi tablo formu anlatacağım gizli bir form değeri ayarlar.

En son eklenen videoyu belirlemek ve doğru yorum dönmek için, benim düşünce bir komut dosyasına belgenin yük ilk küçük masa tanımlayıcısı ile bir ajax yazı göndermek ve döndürülen yorumlar eklenmiş olması ve ajax ile ayarlanan gizli değeri oluşturmak oldu.

Yukarıdaki uygulama kötü bir fikir benim soru olduğunu? Kaynak yoğun olan bir şey değil - o kadar çok yazılan istekleri uygun yorumlarına geçiş yapmak için verimsiz gibi görünüyor, bana söylemek için mi? Ayrıca, hangi veritabanına bağlanmak için söylemek benim komut dosyası için için benim küçük resim id niteliğinde benim veritabanı tablo adları kolayca görünür olması için güvenlidir?

Tüm yardım ve yol boyunca herhangi bir öneriniz için teşekkür ederiz. Bu benim ilk yazı olduğunu ve bir çok kullanışlı web sitesi gibi görünüyor.

2 Cevap

Sayfa-yük bir tek, hatta bir kaç ajax istekleri olması aslında nedeniyle asenkron doğası için yükleme süresi birazcık hızlandırmak olabilir. İnsanların yükü birkaç ajax isteklerini yapmak için oldukça yaygındır, ve sayfa yükler yapmak onun bir tekniği daha hızlı hissediyorum.

Eğer olsa, bir daha da geri standartlaştırılmış bir veri türü dönen düşünebilirsiniz. Eğer bir json dize yorumlardan içerik ve meta verilerini geri gönderildi ise, yorumların kendiniz inşa ve transfer önemli miktarda (hepsi sadece tekrarlanan html etiketleri) kurtarabilir.

Çeşitli web siteleri tarafından kullanılan bir püf viewport alan yorumların yükleme menteşe etmektir. Yorumlar (onlar kat altında ise) görülemez varsa, bunları yüklemek için çok neden yoktur. / Ne zaman aşağı kullanıcı kayar sonra, eğer o noktada istek yapabilirsiniz.

As far as bonus points for the flash video, you'll want to look into a parameter known as wmode and set it to transparent. You also might consider using a standardized swf injection tool like swfobject (or it's jquery plugin version) to add these videos to the page.

Sen yorumlar yükleniyor için loading.gif kullanmak isteyebilirsiniz. Bu sayfaya sadece enjeksiyon HTML beri YouTube video görüntüler komut herhangi bir gecikme olmadan anında çalışacaktır. Videonun gerçek yükleme sayfanızın bağımsızdır.

loading.gif Videoyu aşağı iterek gelince, bu görüntü üzerinde 1'den z-index yüksek olan bir CSS position:absolute; yapmak gerekir. Bu sayfanın akışı dışarı bağlamında görüntü almak ve bu videoyu bindirmek için izin verecektir. Sen üst ve sol CSS özelliklerini kullanarak pozisyonu görüntüyü ortalamak edebilirsiniz. Görüntü ve video yerine position:relative; olan bir kap olduğundan emin olun.