轻微的AJAX问题 [英] Minor AJAX Problem
问题描述
当我点击，检查，更改等形式
（搜索条件）中的任何一个输入时，我正在进行AJAX调用。当用户
点击，检查，等等，我正在尝试显示正在检索
结果......文本。这应该非常简单，但在IE中，它并没有工作。这是在IE中没有执行的代码：
[-----------------------
var status_text = document.getElementById（''status_text''）;
status_text.innerHTML =''< strong>检索用户< span
id =" waiting">< img src =" images / waiting.gif" align =" bottom"
style =" margin-left：5px;" />< / span>< / strong>'';
document.getElementById（" waiting"）。style.display =''inline'';
-------------------------]
以下是该代码的上下文是一个AJAX函数，当单击一个单选按钮，复选框被选中等时，会调用
。
（我要去的是一长串变量遗漏了，但是我把b $ b包括在内以防万一）：
[---------------- ---------
function friendSearch（）{
var status_text = document.getElementById（''status_text''）;
status_text.innerHTML =''< strong>检索用户< span
id =" waiting">< img src =" images / waiting.gif" align =" bottom"
style =" margin-left：5px;" />< / span>< / strong>'';
document.getElementById（" waiting"）。style.display =''inline'';
//首先，从表单中获取所有值。
var browse_what =
findChecked（document.search_users.browse_what）;
var sex = findChecked（document.search_users.sex）;
var age_min = document.search_users.age_min.value;
var age_max = document.search_users.age_max.value;
var marital_status =
findChecked（document.search_users.marital_status）;
var are_here_for =
findChecked（文件.search_users.are_here_for）;
var hair_color = findChecked（document.search_users.hair_color）;
var eye_color = findChecked（document.search_users.eye_color）;
var body_type = findChecked（document.search_users.body_type）;
var ethnicity = findChecked（document.search_u sers.ethnicity）;
var education = findChecked（document.search_users.education）;
var height = findChecked（document.search_users.height）;
var height_min_feet = document.search_users.height_min_feet.value;
var height_min_inches = document.search_users.height_min_inches.value;
var height_max_feet = document.search_users.height_max_feet。值;
var height_max_inches = document.search_users.height_max_inches.value;
var rating_min = document.search_users.rating_min.value;
var rating_max = document.search_users.rating_max.value;
var smoker = findChecked（document.search_users.smoker）;
var drinker = findChecked（document.search_users.drinker）;
var religion = document.search_users.religion.value;
var income = document.search_users.income.value;
var children = document。变奏h_users.children.value;
var show_only_users_with_photos =
findChecked（document.search_users.show_only_users_ with_photos）;
var show_name_and_photo_only =
findChecked（document.search_users.show_name_and_ph oto_only）;
var sort_by =
findChecked（document.search_users.sortby）;
//然后，使用ajax提交更新。
var randomNumber = Math.floor（Math.random（）* 9999999）;
var page_url = ''ajax.friend_search.php？r =''+ randomNumber;
page_url + =''& browse_what =''+ browse_what;
page_url + ='' & sex =''+ sex;
page_url + =''& age_min =''+ age_min;
page_url + =''& age_max ='' + age_max;
page_url + =''& marital_status =''+ marital_status;
page_url + =''& are_here_for =''+ are_here_for;
page_url + =''& hair_color =''+ hair_color;
page_url + =''& eye_color =''+ eye_color;
page_url + =''& body_type =''+ body_type;
page_url + =''& ethnicity =''+种族;
page_url + ='' & education =''+ education;
page_url + =''& height =''+ height;
page_url + =''& height_min_feet ='' + height_min_feet;
page_url + =''& height_min_inches =''+ height_min_inches;
page_url + =''& height_max_feet =''+ height_max_feet;
page_url + =''& height_max_inches =''+ height_max_inches;
page_url + =''& rating_min =''+ rating_min;
page_url + =''& rating_max =''+ rating_max;
page_url + =''& smoker =''+吸烟者;
page_url + =''&喝er =''+ drinker;
page_url + =''& religion =''+ religion;
page_url + =''& income =''+ income ;
page_url + =''& children =''+ children;
page_url + =''& show_only_users_with_photos =''+
show_only_users_with_photos;
page_url + =''& show_name_and_photo_only =''+
show_name_and_photo_only;
page_url + =''& sort_by = ''sort_by;
var oAJAX = new XMLHttpRequest（）;
oAJAX.open（" GET"，page_url）;
oAJAX.onreadystatechange = function（）{
if（oAJAX.readyState == 4）{
if（oAJAX.status == 200） {
//删除状态文本（它将被responseText替换）。
status_text.parentNode.removeChild（status_text）;
文件.getElementById（''search_results''）。innerHTM L =
oAJAX.responseText;
} else {
//document.getElementById("errormsg").childNodes[0].nodeValue =
''检索您请求的数据时出现问题（错误：''+
oAJAX.statusText +''）。请稍后再试。'';
}
}
}
oAJAX.send（null）;
} //结束函数friendSearch
------------------------ ---]
因此IE成功进行了AJAX调用并返回结果，但它只是没有执行显示的代码的第一部分
检索结果......文字。
有什么想法吗？
I am making an AJAX call when any one of a number of inputs in a form
(search criteria) are clicked, checked, changed, etc. When the user
clicks, checks, whatever, I am trying to display a "Retrieving
results..." text. This should be really simple, but in IE, it does not
work. Here''s the code that is not executing in IE:
[-----------------------
var status_text = document.getElementById(''status_text'');
status_text.innerHTML = ''<strong>Retrieving Users<span
id="waiting"><img src="images/waiting.gif" align="bottom"
style="margin-left: 5px;" /></span></strong>'';
document.getElementById("waiting").style.display='' inline'';
-------------------------]
And here is the context of that code, which is the AJAX function that
is called when a radio button is clicked, a checkbox is checked, etc.
(there''s a long list of variables that I was going to leave out, but I
included everything just in case):
[-------------------------
function friendSearch() {
var status_text = document.getElementById(''status_text'');
status_text.innerHTML = ''<strong>Retrieving Users<span
id="waiting"><img src="images/waiting.gif" align="bottom"
style="margin-left: 5px;" /></span></strong>'';
document.getElementById("waiting").style.display='' inline'';
//First, get all the values from the form.
var browse_what =
findChecked(document.search_users.browse_what);
var sex = findChecked(document.search_users.sex);
var age_min = document.search_users.age_min.value;
var age_max = document.search_users.age_max.value;
var marital_status =
findChecked(document.search_users.marital_status);
var are_here_for =
findChecked(document.search_users.are_here_for);
var hair_color = findChecked(document.search_users.hair_color);
var eye_color = findChecked(document.search_users.eye_color);
var body_type = findChecked(document.search_users.body_type);
var ethnicity = findChecked(document.search_users.ethnicity);
var education = findChecked(document.search_users.education);
var height = findChecked(document.search_users.height);
var height_min_feet = document.search_users.height_min_feet.value;
var height_min_inches = document.search_users.height_min_inches.value;
var height_max_feet = document.search_users.height_max_feet.value;
var height_max_inches = document.search_users.height_max_inches.value;
var rating_min = document.search_users.rating_min.value;
var rating_max = document.search_users.rating_max.value;
var smoker = findChecked(document.search_users.smoker);
var drinker = findChecked(document.search_users.drinker);
var religion = document.search_users.religion.value;
var income = document.search_users.income.value;
var children = document.search_users.children.value;
var show_only_users_with_photos =
findChecked(document.search_users.show_only_users_ with_photos);
var show_name_and_photo_only =
findChecked(document.search_users.show_name_and_ph oto_only);
var sort_by =
findChecked(document.search_users.sortby);
//Then, use ajax to commit the update.
var randomNumber = Math.floor(Math.random() * 9999999);
var page_url = ''ajax.friend_search.php?r='' + randomNumber;
page_url += ''&browse_what='' + browse_what;
page_url += ''&sex='' + sex;
page_url += ''&age_min='' + age_min;
page_url += ''&age_max='' + age_max;
page_url += ''&marital_status='' + marital_status;
page_url += ''&are_here_for='' + are_here_for;
page_url += ''&hair_color='' + hair_color;
page_url += ''&eye_color='' + eye_color;
page_url += ''&body_type='' + body_type;
page_url += ''ðnicity='' + ethnicity;
page_url += ''&education='' + education;
page_url += ''&height='' + height;
page_url += ''&height_min_feet='' + height_min_feet;
page_url += ''&height_min_inches='' + height_min_inches;
page_url += ''&height_max_feet='' + height_max_feet;
page_url += ''&height_max_inches='' + height_max_inches;
page_url += ''&rating_min='' + rating_min;
page_url += ''&rating_max='' + rating_max;
page_url += ''&smoker='' + smoker;
page_url += ''&drinker='' + drinker;
page_url += ''&religion='' + religion;
page_url += ''&income='' + income;
page_url += ''&children='' + children;
page_url += ''&show_only_users_with_photos='' +
show_only_users_with_photos;
page_url += ''&show_name_and_photo_only='' +
show_name_and_photo_only;
page_url += ''&sort_by='' + sort_by;
var oAJAX = new XMLHttpRequest();
oAJAX.open("GET", page_url);
oAJAX.onreadystatechange = function() {
if (oAJAX.readyState == 4) {
if (oAJAX.status == 200) {
//Remove status text (it will be replaced by the responseText).
status_text.parentNode.removeChild(status_text);
document.getElementById(''search_results'').innerHTM L =
oAJAX.responseText;
} else {
//document.getElementById("errormsg").childNodes[0].nodeValue =
''There was a problem retrieving the data you requested (Error: '' +
oAJAX.statusText + ''). Please try again later.'';
}
}
}
oAJAX.send(null);
}//end function friendSearch
---------------------------]
So IE successfully makes the AJAX call and returns the results, but it
just does not execute that first part of the code that displays the
"Retrieving results..." text.
Any ideas?
推荐答案
Joel Byrd写道：
Joel Byrd wrote:
当我点击，检查，更改等形式
（搜索条件）中的任何一个输入时，我正在进行AJAX调用。当用户<点击，检查，等等，我正在尝试显示检索结果......文本。这应该是非常简单的，但在IE中，它不起作用。
I am making an AJAX call when any one of a number of inputs in a form
(search criteria) are clicked, checked, changed, etc. When the user
clicks, checks, whatever, I am trying to display a "Retrieving
results..." text. This should be really simple, but in IE, it does not
work.
它不应该在AFAIK的任何其他地方工作，我想你只是检查
只在IE下;-)
浏览器图形上下文仅在脚本执行时更新
break，直到那时图形上下文更新正在积累
（尽管相关的DOM属性已经更新）。更多我想是b $ b想到它，更多我认为它是一个通用的浏览器模型
默认是固定的（通过IE，Firefox和Co）
我意识到对绘图引擎的影响，但实际上在二十一世纪
这不是一个锁定问题。简单的绘图引擎的性能
必须更现代。
回到问题：
....
document.getElementById（" waiting"）。style.display =''inline'';
就在这一行之后你需要给一个微观-break所以浏览器将
根据更新的DOM
属性带来图形上下文。
所以其余的你ajaxoid转到一个单独的函数 - 让我们称之为
doAjaxRequest，该函数现在看起来像：
....
document.getElementById（" waiting"）。style.display =''inline'';
setTimeout（doAjaxRequest）;
//函数结束
}
It shouldn''t work anywhere else neither AFAIK, I guess you just checked
it under IE only ;-)
Browser graphics context is being updated only on script execution
break, until then graphics context updates are just accumulating
(despite the relevant DOM properties are already updated). More I''m
thinking of it, more I consider it to be an universal browser model
default to be fixed (by IE, Firefox and Co)
I realize the impact on the drawing engine, but really in XXI century
it is not a locking issue. Simply the performance of the drawing engine
has to be more modern.
Back to the problem:
....
document.getElementById("waiting").style.display='' inline'';
Right after this line you need to give a micro-break so browser would
bring the graphics context in accordance with the updated DOM
properties.
So the rest of your ajaxoid goes to a separate function - let''s call it
doAjaxRequest, and the function looks now something like:
....
document.getElementById("waiting").style.display='' inline'';
setTimeout(doAjaxRequest);
// end of function
}
VK写道：
VK wrote:
setTimeout（doAjaxRequest）;
setTimeout(doAjaxRequest);
缺少第二个参数（不，有_no_默认值
specie d在任何实现中），并且使用Function对象引用
作为第一个参数，这是不向后兼容的，是不必要的。
window.setTimeout（& ; doAjaxRequest（）"，50）;
PointedEars
The second argument is missing (and no, there is _no_ default value
specified in any implementation), and using a Function object reference
as first argument, which is not backwards compatible, is unnecessary.
window.setTimeout("doAjaxRequest()", 50);
PointedEars
Thomas''PointedEars''Lahn写道：
Thomas ''PointedEars'' Lahn wrote:
VK写道：
VK wrote:
setTimeout（doAjaxRequest）;
setTimeout(doAjaxRequest);
第二个参数丢失了（不，在任何实现中都有_no_默认值
，并且使用Function对象引用
作为第一个参数，这是不向后兼容的，是不必要的。
window.setTimeout（ " doAjaxRequest（）"，50）;
The second argument is missing (and no, there is _no_ default value
specified in any implementation), and using a Function object reference
as first argument, which is not backwards compatible, is unnecessary.
window.setTimeout("doAjaxRequest()", 50);
这对我的Windows 98 SE来说还不够。对我来说，
最小的非圆形刻度是58ms，所以
setTimeout（" doAjaxRequest（）"，50）将导致额外的刻度和42ms
绝望。同时在更好的系统上
setTimeout（doAjaxRequest（），60）将导致最多50毫秒的空气。
全部真的很小，但为什么要品尝什么呢？最好让
让系统选择最小的间隔。
It is not enough for my Windows 98 SE I''using at this moment. The
smallest non-rounded tick is 58ms for me, so
setTimeout("doAjaxRequest()", 50) will lead to the extra tick and 42ms
vasted. At the same time on better systems
setTimeout("doAjaxRequest()", 60) will lead to up to 50ms vasted.
It is all little stuff really, but why vaste anything? It is better to
let the system to choose the smallest interval.
这篇关于轻微的AJAX问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
