使用 jquery ajax 刷新页面
我有一个网络应用程序,在页面上显示用户评论及其发布时间。由于定期有评论发布,所以我需要每 1 分钟更新一次评论发布时间。为此,我使用 jquery ajax 来更新数据库中的时间。我的代码是这样的:
<script type="text/javascript">
setInterval("UpdateTime()", 60000);
function UpdateTime() {
var id=$('#hdID').val();
$.ajax({
type: "POST",
url: "mypage.aspx/UpdateTime",
data: "{'id':'" + id + "'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(msg) {
if (msg.d.length > 0) {
obj = document.getElementById('feed_TimeStamp' + id);
obj.innerHTML = msg.d;
//$(obj).slideDown("slow");
}
},
async: false,
error: function(xhr, status, error) {
//alert(xhr.statusText);
}
});
}
</script>
cs file:
[WebMethod]
public static string UpdateTime(string id)
{
Comments comments = new Comments();
string time = "";
if (comments.LoadByPrimaryKey(Convert.ToInt32(id)))
time = MyClass.GetTime(comments.CommentsDate);
if (!(time.ToLower().Contains("sec") || time.ToLower().Contains("min")))
time = "";
return time;
}
但这里我的问题是,每 1 分钟执行此 web 方法时,整个网页都会挂起,直到 ajax 调用完成。我想刷新时间而不占用页面。
I have a web application where I am showing user comments on a page with its posting time. Since there are comments posted regularly so I need to update the comment posting time after every 1 minute. For this purpose I am using jquery ajax to update the time from db. My code is this:
<script type="text/javascript">
setInterval("UpdateTime()", 60000);
function UpdateTime() {
var id=$('#hdID').val();
$.ajax({
type: "POST",
url: "mypage.aspx/UpdateTime",
data: "{'id':'" + id + "'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(msg) {
if (msg.d.length > 0) {
obj = document.getElementById('feed_TimeStamp' + id);
obj.innerHTML = msg.d;
//$(obj).slideDown("slow");
}
},
async: false,
error: function(xhr, status, error) {
//alert(xhr.statusText);
}
});
}
</script>
cs file:
[WebMethod]
public static string UpdateTime(string id)
{
Comments comments = new Comments();
string time = "";
if (comments.LoadByPrimaryKey(Convert.ToInt32(id)))
time = MyClass.GetTime(comments.CommentsDate);
if (!(time.ToLower().Contains("sec") || time.ToLower().Contains("min")))
time = "";
return time;
}
But here my issue is after every 1 minute when this web Method is executed the whole webpage is hanged away until the ajax call is finished. I want to refresh the time without busing the page.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
这可能是内存问题+更改 ajax 调用中的异步设置。
从
到
当您说
async: false
时,这意味着您不允许浏览器以异步方式发送请求,这与 AJAX 完全相反 - 它应该是异步调用。请参阅此处的文档:
建议:
我认为您正在尝试加载
所有评论
,如果您的结果集较高,浏览器无法保留数据并将其发布到元素上,那么这可能会占用大量内存。我建议您仅从服务器请求新数据,而不是整个“不在评论面板上”,这样您就不会干扰浏览器将所有内容保留在内存中。
This could be a memory PROBLEM + change the settings in your ajax call for async.
from
to
when you say
async: false
that means you are not allowing the browser to send your request in Asynchronous way which is quite opposite to AJAX - it should be an asynchronous call.See the documentation here:
Suggestion:
I think you are trying to load
all comments
which could be a LOT in memory if your result set is high for browser to keep the data and post it on the element.I would suggest you to request only new data from the server instead of whole "which is not on the comments panel", that way you are not bugging browser to keep everything in the memory.
当您使用 jquery ajax 函数时,
页面将保持忙碌状态,直到请求结束。
When you use the jquery ajax function with the
the page will remain busied until the request ends.
去掉这个: async: false (默认情况下为 true)
你不应该同步进行 ajax 调用,除非在极少数情况下你必须等待。
这肯定会锁定页面功能(甚至无法单击鼠标)
Take this out: async: false (by default it is true)
You should not make ajax call in synchronusly unless extreme rare case where you must wait.
This will definitely lock the page from functioning (not even a mouse click possible)