html 无刷新显示公告,用javascript实现页面无刷新更新数据_js
程序设计中会经常碰到一种情况,就是事先无法得知用户会需要哪些数据,必须根据用户选择后再从服务器重新提取数据后反馈给用户。比如一简单的情况,用户选择省份以后,我们立即会在市里边将这个省的所有市重新显示出来。这种情况一般需要将整个页面刷新后才可以重新读取,但这样不仅效率不高外,也显得不太优雅。其实用JavaScript结合微软件的XMLHTTP对象,我们可以不用刷新,“稍稍”的就可以将数据从服务器上读取出来,显得既专业,又高效。
下面我们就以一个验证用户是否被注册的情况来演示这种技术。
1.首先在服务器上建立一个CheckUser.asp文件,用来检测用户是否存在,根据用户是否存在分别反馈0和1
u_name=Request.QueryString(“u_name”)
if u_name 存在 then
Response.write “0”
else
Response.write “1”
end if
2.客户端html设计:
一、javaScript代码
function check_user_exists(form){
u_name=form.u_name.value;
if (u_name==null||u_name==”){
alert(“请您输入用户名”);
return false;
}
infoBoard=document.getElementById(“checkInfo”);
infoBoard.innerText=’查询中…’;
myurl=location.protocol+”//”+location.hostname+”/CheckUser.asp?u_name=”+u_name;
retCode=openUrl(myurl);
switch(retCode){
case “-2”:
infoBoard.innerHTML='抱歉,查询失败’;break;
case “1”:
infoBoard.innerHTML='恭喜,’+u_name+’可以使用’;break;
case “0”:
infoBoard.innerHTML='抱歉,用户名’+u_name+’已经被使用’;
}
return;
}
function openUrl(url){
var objxml=new ActiveXObject(“Microsoft.XMLHttp”)
objxml.open(“GET”,url,false);
objxml.send();
retInfo=objxml.responseText;
if (objxml.status==”200″){
return retInfo;
}
else{
return “-2”;
}
}
二、HTML表单设计:
经过以上三步,一个不需要页面刷新的数据更新程序就完成了,按此方法,可以实现很多很酷的应用。
欢迎大家阅读《用javascript实现页面无刷新更新数据_js》,跪求各位点评,若觉得好的话请收藏本文,by 搞代码
搞代码网(gaodaima.com)提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发送到邮箱[email protected],我们会在看到邮件的第一时间内为您处理,或直接联系QQ:872152909。本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:用javascript实现页面无刷新更新数据_js
html 无刷新显示公告,用javascript实现页面无刷新更新数据_js相关推荐
- php 文件 不更新,php页面不刷新更新数据
php页面不刷新更新数据 php页面不刷新更新数据实现起来很简单,我们可以使用前端的ajax技术. ajax作用:ajax技术的目的是让javascript发送http请求,与后台通信,获取数据和信息 ...
- html网页无刷新数据更新,使用javascript怎么实现页面无刷新更新数据
使用javascript怎么实现页面无刷新更新数据 发布时间:2021-03-18 17:22:21 来源:亿速云 阅读:71 作者:Leah 这篇文章给大家介绍使用javascript怎么实现页面无 ...
- 微信小程序 - 自定义组件中类似页面 onShow 的页面显示就触发的生命周期钩子函数(页面回退时更新数据常用, 例如回退页面更新子组件数据, 回退更新子组件中 data 内容)
前言 在微信小程序中,用户回退页面触发更新数据的操作,一般都是在 页面 onShow() 中写上执行更新的函数即可. 但如果咱们把数据和方法都写在了自定义子组件中,那么用户回退页面时, 更新数据就成了 ...
- html js更新数据不刷新页面,用javascript实现无刷新更新数据
程序设计中会经常碰到一种情况,就是事先无法得知用户会需要哪些数据,必须根据用户选择后再从服务器 重新提取数据后反馈给用户. window.clearInterval与window.setInterva ...
- html网页无刷新数据更新,用javascript实现页面无刷新更新数据
以下正文: 程序设计中会经常碰到一种情况,就是事先无法得知用户会需要哪些数据,必须根据用户选择后再从服务 器重新提取数据后反馈给用户.比如一简单的情况,用户选择省份以后,我们立即会在市里边将这个省的 ...
- 前台调用后台方法,无刷新更新数据
语句的作用:页面注册方法的作用. AjaxPro.Utility.RegisterTypeForAjax(typeof(命名空间.类名)); Default.aspx.cs public parti ...
- vue 路由参数变化,页面不刷新(数据不更新)解决方法
路由参数改变,页面数据不更新解决方法: http://localhost:8080/#test?id=1 http://localhost:8080/#test?id=2,参数切换后,数据未更新 以下 ...
- vue页面返回上一级页面不刷新,数据还在(详情页返回列表页)
1. 配置路由缓存 component: () => import('views/entrance/index')}, {path: '/seniorList',name: 'list',tit ...
- 社区网站功能实现系列(三):社区页面无刷新回发的一种实现方式
页面无刷新回发实现有很多种方式,可以用XMLHttpRequest,一些js框架的ajax实现(如jQuery的 ajax),ajaxPro,MS的UpdatePanel,web服务等.下面我来介绍另 ...
最新文章
- kvm虚拟机vnc配置
- python写入csv(解决了乱码问题)
- 2015年十佳IDC评选结果:50强名单揭晓
- Kibana——数据图形化制作
- python判断灰度图
- python学精通要多久-学习Python零基础需要学多久?
- adc的使用屏幕上显示单位v。显示结果精确到小数位后3位。_为什么要关注示波器 ADC 位数或者是 ENOB?- 了解信号的完整性...
- 1. Leetcode 1. 两数之和 (数组-双向双指针)
- asp python 定时任务_python定时任务最强框架APScheduler详细教程
- 全数字实时仿真平台SkyEye的同步数据流语言可信编译器的构造
- 源数据怎么排查重复MySQL_面试官:在使用mysql数据库时,遇到重复数据怎么处理?...
- PyCharm修改主题和修改背景
- html 静态网页如何在手机上访问,anywhere,http-server
- 15-Mixly模拟输出 | Mixly技巧系列
- 人体姿态估计之CPN中文文献翻译
- 时代当歌,懂行为剑,英雄正少年
- Java入门教程笔记07(面向对象基础)
- 翻斗式雨量传感器的材质分类和工作原理
- 【网络协议模糊测试实战】使用sulley对PCManFTP进行模糊测试
- JAVAWEB之JSTL标签