طراحی سایت در شرکت طراحی سایت مبنا
طراحی سایت هدف نیست، ارتقا تجارت هدف است

ساختار Ajax

10 / 10 از 1 کاربر

در این بخش ازمقالات طراحی سایت در قسمت آموزش Ajax می خواهیم ساختار Ajax  را توضیح دهیم.
همانطور که از معنی اسم ای جکس پیداست این فناوری از جاوا اسکریپت و xml تشکیل شده است . برای راحتی درک و ساختار ای جکس ابتدا مثالی را بیان می کنیم.در این مثال از تگ div و دکمه ی فرمان button  در یک صفه اچ تی ام ال استفاده می کنیم و می خواهیم پس از کلیک کاربر بر روی دکمه ی فرمان متن جدید آن از سرور دریافت شده و به روز رسانی شود. به مثال توجه نمایید:

< html >
< head >
  < script type = " text/javascript " >
    function loadXMLDoc ( )
      {
        .... کد ها و دستورات Ajax در اینجا قرار می گیرد ...
      }
  < /script >
< /head >
< body >
  < div id="myDiv" >
    متن این قسمت را با Ajax تغییر دهید
  < /div >
  < button type="button" onclick=" loadXMLDoc() " > Change Content < /button >
< /body >
< /html >

با کد بالا پس از کلیک سرور درخواست را دریافت می کند و پس از پردازش آن را اجرا خواهد کردکد تابع ( ) loadXMLDoc  در جدول زیر قرار داده شده است .

function loadXMLDoc()
  {
    var xmlhttp;
    if (window.XMLHttpRequest)
      {
        // code for IE7+, Firefox, Chrome, Opera, Safari                          کد برای مرورگرهای جدید
            xmlhttp=new XMLHttpRequest();
      }
    else
      {
        // code for IE6, IE5                                                                          کد برای مرورگرهای قدیمی تر
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
    xmlhttp.onreadystatechange=function()
      {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
          {
            document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
          }
      }
    xmlhttp.open("GET","ajax_info.txt",true);
    xmlhttp.send();
  }

 در مقالت بعدی طراحی سایت اطلاعات تکمیلی بیشتری را در زمینه طراحی سایت در اختیار شما کاربران عزیز قرار خواهیم داد.

ارسال نظر و نظرات ثبت شده
نام شما :
ایمیل :
تلفن تماس :
متن پیغام :