`

Ajax无刷新数据更新

 
阅读更多

<script type="text/javascript">

//异步请求对象
var xmlRequest;

//得到请求对象 
function getXMLHttpRequestObject() {

//不同的浏览器创建方式不同
try {
xmlRequest = new XMLHttpRequest(); //Firefox ,safari
} catch (e) {
//IE
try {
xmlRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
xmlRequest = new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlRequest;//返回
}
//检查用户是否存在
function checkType(selectType) {
alert(selectType);
//用户名输入不能为空
if (selectType == "") {
document.getElementById("selectType").innerHTML = "<font color='red'>&nbsp;不能为空!</font>";
return;
}
//得到请求对象
xmlRequest = getXMLHttpRequestObject();
if (xmlRequest == null) {
alert("您的浏览器不支持AJAX!");
return;
}
var url = "/datacenter/analysisBLOAction.action"; //请求页面
url += "?selectType=" + selectType; //用户名
url = encodeURI(url);
url = encodeURI(url);
xmlRequest.onreadystatechange = stateChanged;//状态改变调用函数
xmlRequest.open("POST", url, true);
//xmlRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
xmlRequest.send(null); // 发送请求
}
//是否已经存在检查
function stateChanged() {
if (xmlRequest.readyState == 4) {
if (xmlRequest.status == 200) {
showMess();
} else {
//页面不正常
window.alert("您所请求的页面有异常。");
}
} else {
//请求状态还没有成功,页面等待
document.getElementById("selectType").innerHTML = "检查中...";
}
}
//检查 异步处理显示信息
function showMess() {
var message = xmlRequest.responseText;
document.getElementById("selectType").innerHTML = message;
}
</script>

分享到:
评论

相关推荐

    Ajax全新教程 无刷新页面 无刷新数据更新 无刷新绑定 asp.net全新Ajax教程

    无刷新数据更新是Ajax实现无刷新页面的关键技术。它允许在后台与服务器进行通信,获取或发送数据,然后仅更新页面中的指定部分。例如,一个实时聊天应用,可以通过Ajax实现在不刷新页面的情况下接收到新的消息并显示...

    ajax 无刷新 无动作 页面数据自动更新

    实现"无刷新无动作"的页面数据自动更新,通常采用定时器(`setInterval`或`setTimeout`)配合Ajax技术。每隔一段时间,前端通过Ajax发送请求到后台,后台接收到请求后处理并返回新数据。前端接收到新数据后,利用...

    Ajax无刷新实现定时更新数据

    ### Ajax无刷新实现定时更新数据:深入解析与实践 在现代Web开发中,用户体验的提升是永恒的主题之一,而实时性则是用户体验中的关键因素。传统的网页刷新方式在更新数据时会打断用户操作,造成不流畅的体验。为了...

    AJAX页面无刷新实现数据更新

    **AJAX页面无刷新实现数据更新** 在网页开发中,用户界面的实时性和交互性是提升用户体验的关键因素。AJAX(Asynchronous JavaScript and XML)技术就是为了解决这个问题而诞生的,它允许网页在不重新加载整个页面...

    thinkphp+ajax无刷新分页

    在ThinkPHP框架中,无刷新分页主要依赖于AJAX请求来获取数据,并通过JavaScript处理返回的数据,动态更新页面上的内容。具体步骤如下: 1. **初始化分页对象**:在控制器中创建一个分页对象,设置总记录数、每页...

    Ajax无刷新删除数据

    在Web开发中,Ajax无刷新删除数据是一个常见的需求,它极大地提升了用户体验,因为用户可以在不离开当前页面的情况下完成操作,使得交互更加流畅。 在实现Ajax无刷新删除数据的过程中,涉及的关键知识点包括: 1. ...

    Java Ajax 无刷新分页实例(完整版)

    在网页开发中,Java AJAX(Asynchronous JavaScript and XML)技术被广泛用于实现页面的无刷新更新,提升用户体验。本实例提供了完整的Java AJAX无刷新分页解决方案,允许用户在不重新加载整个页面的情况下浏览多页...

    JavaScript通过Web Service实现AJAX无刷新数据交互

    JavaScript通过Web Service实现AJAX无刷新数据交互是一种常见的前端与后端通信技术,它极大地提升了网页的用户体验。AJAX(Asynchronous JavaScript and XML)的核心在于异步更新页面内容,而无需用户手动刷新整个...

    通过Ajax无刷新读写操作

    1. **文本框**:用户在文本框中输入信息,点击按钮后,使用Ajax将数据发送到服务器,服务器处理后将结果返回,无需刷新页面,可以实时更新文本框旁边的提示信息。 2. **下拉框**:当用户从下拉框中选择一个选项时,...

    ajax无刷新分页

    Ajax,即Asynchronous JavaScript and XML(异步JavaScript和XML),允许我们在不刷新整个页面的情况下与服务器交换数据并局部更新页面。 **一、Ajax基础** 1. **异步通信**: Ajax的核心是XMLHttpRequest对象,它...

    AJAX无刷新留言 无刷新

    通过以上分析,我们可以看出,这个“AJAX无刷新留言”系统利用了AJAX技术提高了用户体验,结合ASP.NET的GridView控件实现了动态数据展示,同时提供了头像选择功能,使得用户互动更加便捷。服务器端的接口设计和...

    ajax实时刷新数据

    ajax实时刷新数据

    AJAX无刷新更新数据

    ### AJAX无刷新更新数据知识点详解 #### 一、引言 在现代Web开发中,提升用户体验是至关重要的。其中一种实现方式就是通过Ajax技术来实现页面局部更新,从而避免整个页面的重新加载,大大提升了用户的交互体验。...

    JSP数据库数据AJAX无刷新分页

    "JSP数据库数据AJAX无刷新分页"是一个常见的技术实现,它结合了JavaServer Pages(JSP)、数据库技术、Ajax(Asynchronous JavaScript and XML)以及前端分页组件,为用户提供了一种无需整个页面刷新即可获取并显示...

    Ajax 无刷新投票

    在Web开发中,Ajax(Asynchronous JavaScript and XML)技术是一种能够让网页在不重新加载整个页面的情况下与服务器交换数据并更新部分网页的技术。"Ajax 无刷新投票"就是利用Ajax实现的一种交互方式,它允许用户在...

    Ajax全新教程2 无刷新页面 无刷新数据更新 无刷新绑定 asp.net全新Ajax教程2

    无刷新数据更新是Ajax的另一个关键特性。在传统的Web应用中,每当有新的数据需要显示时,都需要刷新整个页面。但通过Ajax,我们可以向服务器发送异步请求,获取最新数据,然后动态地将这些数据插入到页面的特定位置...

    asp Ajax无刷新文件上传(带进度条,无组件)

    【ASP AJAX无刷新文件上传技术详解】 在网页开发中,用户常常需要进行文件上传操作,传统的文件上传方式通常会伴随着页面的刷新,这不仅影响用户体验,也可能导致数据丢失。为了解决这一问题,ASP(Active Server ...

    ajax无刷新投票系统

    **Ajax无刷新投票系统详解** Ajax(Asynchronous JavaScript and XML)技术是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。它通过在后台与服务器进行少量数据交换,使网页实现异步更新,大大提升...

Global site tag (gtag.js) - Google Analytics