| |
|
|
| | Здрасте!
недавно решил немного окунуться в асинхронные запросы, частично получилось, понравилось, но только один момент в опере и сафари огорчил.
при загрузке страницы вызывается яваскрипт getCat():
var searchReq = getXmlHttpRequestObject(); // определение браузера
function getCat (){
if (searchReq.readyState == 4 || searchReq.readyState == 0) {
searchReq.open("GET", ajaxfile + '?cat=categories', true);
searchReq.onreadystatechange = putCat;
searchReq.send(null);
|
putCat():
function putCat() {
if (searchReq.readyState == 4) {
var subCat = document.getElementById('type');
subCat.innerHTML = '';
var str = searchReq.responseText.split("\n");
var selectTag = '<h3 class="quicksrc">Быстрый поиск</h3>';
selectTag += '\n\t<select class="styled" name="subcategories" id="category" onchange="getSubcat(this.value)">\n';
selectTag += '\t\t<option value="0" style="border-bottom:1px solid black;">...категория</option>\n';
for (var i = 0; i < str.length-1; i++) {
var splitted = str[i].split(";;");
selectTag += '\t\t<option value="' + splitted[0] + '">' + splitted[1] + '</option>\n';
}
selectTag += '\t</select>\n';
subCat.innerHTML += selectTag;
} else {
var myLoad = document.getElementById('type');
myLoad.style.textAlign = 'center';
myLoad.innerHTML = '<img src="/UserFiles/Image/' + ajaxImg + '">';
}
}
|
и все вышеупомянутое создает выпадающее меню SELECT с категориями оборудования, в котором при событии onChange вызывается похожая функция, которая делает выпадающее меню SELECT с подкатегориями...
и проблема состоит в том, что все это прекрасно работает в ФФ и ИЕ - пока readyState не 4, вместо меню выставляется анимированный гиф на место подгружаемого меню, а меню категорий остается там, где и должно быть; а в Опере и Сафари, при выборе категории и появлении меню с подкатегориями, тогда как меню самих категорий заменяется картинкой ajaxImg. Надеюсь более или менее понятно объяснил. Если кто- сталкивался с таким уже, буду признателен подсказке :) скапибо!
P.S.: код у меня скорее всего "грязный", но я только учусь :) | |
| |
|
|
| |
|
|
| |
для: dimon
(25.02.2009 в 13:03)
| | | заменил if () {} ... else {} на switch (readyState)... как-то странно происходит выполнение скрипта, на самом деле.... | |
| |
|
|
| |
|
|
| |
для: dimon
(25.02.2009 в 13:38)
| | |
} else {
var myLoad = document.getElementById('type');
myLoad.style.textAlign = 'center';
myLoad.innerHTML = '<img src="/UserFiles/Image/' + ajaxImg + '">';
}
|
выполняется когда readyState == 0,1,2,3
чтобы не ломать моск, лучше всего до аякс запроса показать загрузочную картинку, а при выполненном запросе убрать. | |
| |
|
|
| |
|
|
| |
для: sl1p
(25.02.2009 в 14:44)
| | | абсолютно согласен.. еще прикол в том, что если сделать
} else if (searchReq.readyState !== 1) {
var myLoad = document.getElementById('type');
myLoad.style.textAlign = 'center';
myLoad.innerHTML = '<img src="/UserFiles/Image/' + ajaxImg + '">';
}
|
то в ИЕ, ФФ и Сафари картинка загрузки вообще не отображается, а в Опере видно, как она меняется при смене readyState, тогда как при обычном else все работает более плавно =) | |
| |
|
|
