PDA

View Full Version : آموزش و اسكريپت هاي آماده آجاكس


black_benz
21 September 2007, 09:31 PM
با سلام
تو اين تاپيك من هر لينك در باره آجاكس و اسكريپت هاي آماده اون داشته باشم مي زارم و از دوستان هم خواهش مكنم شركت كنند
اول از همه طرز استفاده از يكي كدهاي آجاكس كه استفاده زيادي داره و تو همه وب سايت ها براي افزايش سرعت لود شدن صفحات ميشه ازش استفاده كرد رو توضيح مي دم .با اين اسكريپ مي شود مطالب داخل يك <div رو طوري عوض كرد كه صفحه رفرش نشه براي اين كار از يك تابع اجاكس كه در داخلش XMLHttpRequest وجود داره استفاده مي كنيم

<script language="JavaScript">
var xmlHttp;
function createRequest(){
if(window.ActiveXObject){
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} else if(window.XMLHttpRequest){
xmlHttp = new XMLHttpRequest();
}
}
function page(url){
createRequest();
xmlHttp.open("GET", url, true);
xmlHttp.onreadystatechange = updatepage;
xmlHttp.send(null);
}
function updatepage(){
document.getElementById('page').innerHTML = "<div><img src='ldgimg.gif'><br>Loading Please Wait</div>"
if(xmlHttp.readyState == 4){
document.getElementById('page').innerHTML = xmlHttp.responseText
}
}
</script>

كد بالا رو در قسمت هدر صفحه قرار بديد يا اينكه اون رو داخل يك صفحه ديگه مثلا ajax.js كپي كنيد و اون رو به صفحه اصلي لينك كنيد البته براي روش دوم بايد
<script language="JavaScript">
</script>

رو حضو كنيد. توي كد يك <div وجود داره كه در هنگام لود شدن نشون داده ميشه پس عكس يا هر چيز ديگه كه مي خواين در هنگام لود شدن نشون داده بشه در اين قسمت قرار بديد.

حالا يك <div در قسمت بادي صفحه و جايي كه مي خواين اطلاعات اوجا قرار بگيره درست كنيد و id اون رو page بزاريد

<div id="page">
</div>



حلا فقط يك لينك لازم داريم كه بايد روي آنكليكش تابع آجاكس رو صدا بزنيم
<p align="center">
<a href="#" onclick="page('next.php');">
page</a></p>


بجاي next.php اسمه صفحه اي رو قرار ديد كه مي خواين اطلاعاتش بدون رفرش شدن ديده بشه
موفق باشد




اينم چند تا نمونه
با اين متونيد جند صفحه رو با هم نوشون بديد يعني رو يك صفحه چند تا تب داشته باشيد
http://www.dynamicdrive.com/dynamicindex17/ajaxtabscontent/


يك اسلايد شو زيبا براي گالري عكس
http://smoothgallery.jondesign.net

با اين كد مي تونيد يك پنچره جديد با همه امكانات باز كنيد.
http://prototype-window.xilinus.com