سلام. توی این مطلب میخوایم به دوستان عزیز سورس باران جلسه چهارم آموزش Ajax – ناهم زمان، پاسخ سرور و رویداد و… در ای جکس آشنا خواهید شد . از وب سایت آموزش برنامه نویسی سورس باران با شما خواهیم بود. ای جکس (Ajax)، مجموعهای از استانداردها و فناوریهای وب است که به کمک آنها میتوان برنامههایی مبتنی بر وب تولید کرد که به آسانی با کاربران تعامل داشته باشند. با استفاده از این فناوریها و با کمک انتقال تکههای کوچک داده و اطلاعات از رایانهٔ خادم (Server)، صفحات وب از حالت منفعل خارج میشوند و واکنشهایی مناسب با رویدادها انجام میدهند. ایجکس معماری جدیدی برای برنامههای تحت وب است، که با سرعت بسیار زیادی در حال گسترش بوده، و کمتر کاربر اینترنت است که هنوز گذرش به یکی از صفحاتی که با این معماری ساخته شدهاند نیفتاده، و از قابلیتهای فوقالعاده آن بهرهمند نشده باشد. شروع جلسه چهارم آموزش Ajax – ناهم زمان، پاسخ سرور و رویداد در ای جکس در ادامه مطلب…
جهت مشاهده جلسه چهارم آموزش Ajax – ناهم زمان، پاسخ سرور و رویداد در ای جکس به ادامه مطلب مراجعه نمایید.
ناهم زمان (آسنکرون) – True یا False :
ای جکس (AJAX) مخفف عبارت Asynchronous JavaScript and XML بوده و برای اینکه آبجکت XMLHttpRequest بعنوان AJAX عمل کند ، باید پارامترasync در متد ()open به روی حالت True تنظیم شود.
1 |
xmlhttp.open("GET","ajax_test.asp",true); |
ارسال درخواست های ناهمزمان پیشرفت بزرگی برای توسعه دهندگان وب است . بسیاری از وظایف و کارهایی که بر روی سرور انجام میشود وقت گیر هستند . قبل از AJAX ، ممکن بود این عملیات باعث هنگ کردن وتوقف اپلیکیشن شود . با وجود ای جکس ، دیگر لازم نیست تا جاوااسکریپت منتظر پاسخ سرور بماند ، بلکه در عوض میتواند :
- در حالی که منتظر پاسخ سرور است ، اسکریپت های دیگری را اجرا کند
- هنگامی که پاسخ اماده شد با آن مقالبه کند
آسینک (async) = True
زمان استفاده از async=true ، تابعی را تعیین کنید تا در هنگام اماده شدن پاسخ در رویداد(ایوِنت) onreadystatechange به اجرا درآید :
مثال :
1 2 3 4 5 6 7 8 9 |
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(); |
در بخش های اینده با مطالب بیشتری در مورد onreadystatechange اشنا خواهید شد .
آسینک (Async) = false
برای استفاده از Async=false, پارامتر سوم در متد open() را بهfalse تغییر دهید :
1 |
xmlhttp.open("GET","ajax_info.txt",false); |
استفاده از async = false به طور کلی توصیه نمیشود اما در مواردی برای بعضی ازدرخواست ها استفاده از ان موردی ندارد. به یاد داشته باشید که تا زمانی پاسخ سرور آماده نباشد جاوا اسکریپت به اجرا ادامه نخواهد داد . اگر سرور مشغول و یا ضعیف باشد ، اپلیکیشن نیز هنگ خواهد کرد و متوقف میشود.
نکته : هنگامی که از Async=false استفاده میکنید ، به خاطر داشته باشید تا از تابع onreadystatechange استفاده نکنید ! تنها کد را بعد از جمله send() قرار دهید.
1 2 3 |
xmlhttp.open("GET","ajax_info.txt",false); xmlhttp.send(); document.getElementById("myDiv").innerHTML=xmlhttp.responseText; |
پاسخ سرور در Ajax :
برای دریافت پاسخ از سوی سرور ، از خاصیت responseText و یا responseXML ابجکت XMLHttpRequest بهره بگیرید.
داده های پاسخ را به عنوان یک رشته (String)درمی آورد : responseText
داده های پاسخ را به عنوان داده های XML در می آورد : responseXML
خاصیت responseText :
اگر پاسخی که از سرور دریافت کرده اید ، XML نمیباشد ، از خاصیت responseText استفاده کنید. این خاصیت پاسخ را به عنوان یک رشته برمیگرداند و شما میتوانید بر این اساس از ان استفاده کنید :
1 |
document.getElementById("myDiv").innerHTML=xmlhttp.responseText; |
خاصیت responseXML :
اگر پاسخی دریافتی از سرور XML میباشد و شما میخواهید آن را به عنوان یک آبجکت XML تجزیه کنید از خاصیت responseXML استفاده کنید، فایل cd_catalog.xml را درخواست داده و پاسخ را تجزیه کنید :
1 2 3 4 5 6 7 8 |
xmlDoc=xmlhttp.responseXML; txt=""; x=xmlDoc.getElementsByTagName("ARTIST"); for (i=0;i<x.length;i++) { txt=txt + x[i].childNodes[0].nodeValue + "<br>"; } document.getElementById("myDiv").innerHTML=txt; |
موفق و پیروز باشید.
راستی! برای دریافت مطالب جدید در کانال تلگرام یا پیج اینستاگرام سورس باران عضو شوید.
- انتشار: ۱۱ شهریور ۱۳۹۴
دسته بندی موضوعات
- آموزش ارز دیجیتال
- آموزش برنامه نویسی
- آموزش متنی برنامه نویسی
- اطلاعیه و سایر مطالب
- پروژه برنامه نویسی
- رپورتاژ
- فروشگاه
- فیلم های آموزشی
- ++C
- ADO.NET
- Adobe Flash
- Ajax
- AngularJS
- apache
- ARM
- Asp.Net
- ASP.NET MVC
- AVR
- Bootstrap
- CCNA
- CCNP
- CMD
- CSS
- Dreameaver
- EntityFramework
- Go
- HTML
- IOS
- jquery
- Linq
- Mysql
- Oracle
- PHP
- PHPMyAdmin
- Rational Rose
- silver light
- SQL Server
- Stimulsoft Reports
- Telerik
- UML
- VB.NET&VB6
- WPF
- Xml
- آموزش های پروژه محور
- اتوکد
- الگوریتم تقریبی
- امنیت
- اندروید
- اندروید استودیو
- بک ترک
- بیسیک فور اندروید
- پایتون
- جاوا
- جاوا اسکریپت
- جوملا
- دلفی
- دوره های رایگان پیشنهادی
- زامارین
- سئو
- ساخت CMS
- سی شارپ
- شبکه و مجازی سازی
- طراحی الگوریتم
- طراحی بازی
- طراحی وب
- فتوشاپ
- فریم ورک codeigniter
- فلاتر
- کانستراکت
- کریستال ریپورت
- لاراول
- معماری کامپیوتر
- مهندسی اینترنت
- هوش مصنوعی
- یونیتی
- کتاب های آموزشی
- Android
- ASP.NET
- AVR
- LINQ
- php
- Workflow
- اچ تی ام ال
- بانک اطلاعاتی
- برنامه نویسی سوکت
- برنامه نویسی موبایل
- پاسکال
- پایان نامه
- پایتون
- جاوا
- جاوا اسکریپت
- جی کوئری
- داده کاوی
- دلفی
- رباتیک
- سئو
- سایر کتاب ها
- سخت افزار
- سی اس اس
- سی پلاس پلاس
- سی شارپ
- طراحی الگوریتم
- فتوشاپ
- مقاله
- مهندسی نرم افزار
- هک و امنیت
- هوش مصنوعی
- ویژوال بیسیک
- نرم افزار و ابزار برنامه نویسی
- وردپرس