لودینگ آژاکس

Yue

New Member
سلام
این کد مربوط به آژاکس هست که من دارم و عملیات مورد نظر انجام هم میشه اما میخواستم تا وقتیکه محتوا نمایش داده بشود یک لودینگ قرار بدم کد زیر چه تغییری لازم داره؟ یا کلا چه بخش هایی باید تغییر پیدا کنه

این تصویر رو میخواستم تا قبل از اینکه محتوا لود بشه نمایش بدم :
mozilla_giallo.gif




HTML:
function menuRequest(url)
{
var arg = url;
url = "content.php?q=" + url;
var http_request = false;

if (window.XMLHttpRequest)
{ // Mozilla, Safari,...
http_request = new XMLHttpRequest();

if (http_request.overrideMimeType)
{
http_request.overrideMimeType('text/xml');
// See note below about this line
}
} else if (window.ActiveXObject)
{ // IE
try
{
http_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e)
{
try
{
http_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}

if (!http_request)
{
alert('Giving up :( Cannot create an XMLHTTP instance');
return false;
}

http_request.onreadystatechange = function() { alertContents(http_request); };
http_request.open('GET', url, true);
http_request.send(null);

}


function alertContents(http_request)
{
if (http_request.readyState == 4)
{
if (http_request.status == 200)
{
document.getElementById("content").innerHTML=http_request.responseText;
}
else
{
alert('There was a problem with the request.');
}
}
}
 
آخرین ویرایش:

Webber

Well-Known Member
با سلام
می تونید فایل زیر رو امتحان کنید.
موفق باشید
 

پیوست ها

  • PageLoding.zip
    7.1 کیلوبایت · بازدیدها: 127

eAmin

Well-Known Member
اسكريپت به همراه آموزش
كليك كنيد

سلام.

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

شما یه Div دارید که id اون content هست تنها کاری که شما باید انجام بدید اینه که این کد رو در قسمت اول این تابع کپی کن alertContents ، با این کار هرچیزی که در اخل Div هست برداشته می شه و به جاش اطلاعاتی که با AJAX وارد کردین گذاشته می شه.
HTML:
document.getElementById("content").innerHTML="<img src="http://img.majidonline.com/pic/133220/mozilla_giallo.gif" />";

این هم کد کامل شما:

HTML:
function menuRequest(url)
{
var arg = url;
url = "content.php?q=" + url;
var http_request = false;

if (window.XMLHttpRequest)
{ // Mozilla, Safari,...
http_request = new XMLHttpRequest();

if (http_request.overrideMimeType)
{
http_request.overrideMimeType('text/xml');
// See note below about this line
}
} else if (window.ActiveXObject)
{ // IE
try
{
http_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e)
{
try
{
http_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}

if (!http_request)
{
alert('Giving up :( Cannot create an XMLHTTP instance');
return false;
}

http_request.onreadystatechange = function() { alertContents(http_request); };
http_request.open('GET', url, true);
http_request.send(null);

}


function alertContents(http_request)
{

document.getElementById("content").innerHTML="<img src="http://img.majidonline.com/pic/133220/mozilla_giallo.gif" />";

if (http_request.readyState == 4)
{
if (http_request.status == 200)
{
document.getElementById("content").innerHTML=http_request.responseText;
}
else
{
alert('There was a problem with the request.');
}
}
}
 

arinolan

Member
جواب ساده

سلام دوست عزیز جائی که if داری که گفتی اگه state 4 بود رو یه else بهش اضافه کن و توی اون else کدی بنویس که عکس مورد نظرتو توی صفحه نمایش بده .... مشکلت راحت حل میشه

نمونه :

if (xmlHttp.readyState==4)
{
document.getElementById("process").innerHTML=xmlHttp.responseText;
}else{
document.getElementById("process").innerHTML="<img src=\"images/wait.gif\" />";
}
 
آخرین ویرایش:

جدیدترین ارسال ها

بالا