ajax获取返回随机数,AJAX

AJAX

AJAX:即“Asynchronous Javascript And XML”(异步的JavaScript和XML),是指一种创建交互式网页应用的网页开发技术,尤其是在一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。

传统Web开发

World Wide Web(简称Web):是随着Internet的普及使用而发展起来的一门技术,其开发模式是一种请求→刷新→响应的模式,每个请求由单独的一个页面来显示,发送一个请求就会重新获取这个页面。

ceccda099778

Ajax采用异步通信,主要以数据交互为主;传统的web开发采用同步通信,主要以页面交互为主。

例子:在页面写一个生成随机数的表单

用form表单提交的方式

index.jsp

$Title$

${num}

random.do

@WebServlet(name = "randomServlet",urlPatterns = "/random.do")

public class randomServlet extends HttpServlet {

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

String strmax = request.getParameter("max");

int max = Integer.parseInt(strmax);

Random random = new Random();

int num = random.nextInt(max);

request.setAttribute("num",num);

request.setAttribute("max",max);

request.getRequestDispatcher("index.jsp").forward(request,response);

}

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

}

}

用这种方式是向后台提交整个网页

下面用ajax方式

ajax请求步骤

1.创建Ajax对象

var request = new XMLHttpRequest();

2.连接服务器

open(method,url,async);

request.open("get","query.do",true);

//get或者post(多用get),请求的服务器地址,同步(false)或者异步(true)请求

3.发送请求

send(string)

在使用GET方式请求时无需填写参数,对数据库无害的时候用get

req.open('get','random.do?max=100‘,true);

req.send();

在使用POST方式时参数代表着向服务器发送的数据

req.open('post','random.do',true);

req.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

//post请求需要设置HTTP头信息,否则发送数据有问题

req.send('max=100');

4.接收服务器相应数据

req.onload = function () {

console.log(req.responseText);

}

index.jsp

$Title$

function getNum() {

var input = document.getElementById("max");

//以ajax的方式(js),向服务器发出请求,收到回应(回应中包含服务器生成的随机数)

//1.创建ajax请求对象

var req = new XMLHttpRequest();

//2.调用第一步中创建的req对象的open方法,设置连接服务器的信息

//open(method,url,async);method是post或者get,url是链接地址,async是true(异步)或者false(同步)

req.open("get","random.do?max="+input.value,true);

//3.真正向服务器发出该请求

req.send();

//4.处理服务器的回应,服务器回应的数据可以在req对象的responseText属性中获得

req.onload = function () {

//将该随机数显示在id是num的div中

var div = document.getElementById("num");

div.innerHTML = req.responseText;

}

}

random.do

@WebServlet(name = "randomServlet",urlPatterns = "/random.do")

public class randomServlet extends HttpServlet {

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

String strmax = request.getParameter("max");

int max = Integer.parseInt(strmax);

Random random = new Random();

int num = random.nextInt(max);

PrintWriter printWriter = response.getWriter();

printWriter.println(num);

// request.setAttribute("num",num);

// request.setAttribute("max",max);

// request.getRequestDispatcher("index.jsp").forward(request,response);

}

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

doPost(request,response);

}

}

ajax校验用户名是否已存在

ceccda099778

index.jsp

$Title$

function check() {

var input = document.getElementById("username");

var req = new XMLHttpRequest();

req.open("get","reg.do?username="+input.value,true);

req.send();

req.onload = function () {

var span = document.getElementById("msg");

if(req.responseText == 1){

span.innerHTML = "用户名已经存在";

span.style.color = "red";

}

else{

span.innerHTML="可以注册";

span.style.color = "green";

}

}

}

name:

hobby:

reg.do

@WebServlet(name = "regServlet",urlPatterns = "/reg.do")

public class regServlet extends HttpServlet {

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

}

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

String username = request.getParameter("username");

if(username.equals("admin")){

response.getWriter().println(1);

}

else {

response.getWriter().println(0);

}

}

}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/487241.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Neuron:迄今为止最大的颗粒细胞数据,发现海马齿状回神经元可过滤并放大空间信息...

来源:brainnews小柯生命 报道北京时间2020年8月6日晚,奥地利科学与技术研究所 (IST, Austria)的科研团队在《神经元》上发表论文,发现海马齿状回的神经元可以过滤并且放大空间信息。 出租车司机如何在错综复杂的大街小…

C#实现文件与二进制互转并存入数据库

这篇文章主要介绍了C#实现文件与二进制互转并存入数据库,本文直接给出代码实例,代码中包含详细注释,需要的朋友可以参考下 //这个方法是浏览文件对象private void button1_Click(object sender, EventArgs e){//用户打开文件浏览using (OpenFileDialog dialog new OpenFileDia…

u盘服务器安装win7系统安装教程,最简单的u盘装win7系统详细教程及步骤

随着技术的进步,越来越多的安装电脑系统的方法,有硬盘方式安装,有一键重装系统软件,有U盘重装系统,有光盘安装方法,那么哪种方式最安全呢?答案肯定是U盘安装电脑系统方式最安全,因为…

周志华:“数据、算法、算力”人工智能三要素,在未来要加上“知识”| CCF-GAIR 2020...

来源:雷锋网作者 | 李雨晨如何将“机器学习“与“逻辑推理”相结合,是人工智能领域的“圣杯问题””编者按:2020 年 8 月 7 日,全球人工智能和机器人峰会(CCF-GAIR 2020)正式开幕。CCF-GAIR 2020 峰会由中国…

AJAX扩展-POST传递参数并跳转页面

拓展的代码: 这段代码的原理是创建一个表单,所有args都创建一个隐藏的input,用post方法把这些参数传递过去 注意form表单一定要加载到页面中,即下面代码中标红的部分,不然参数是无法被传递的(因为这个被坑了…

酒店叫醒系统服务器,酒店叫醒服务的流程

酒店叫醒服务的流程1、接听客人叫醒服务1)当接到客人需要叫醒服务时,要问清客人房号、姓名及叫醒时间;2)复述客人叫醒的要求,以获客人确认;3)检查叫醒客房的种类和客人类型,如是套房、VIP,必须作出特别提示…

ISC 2020周鸿祎:以云端大脑为核心打造国家安全反导系统

来源:秦安战略“进入数字孪生时代,网络攻击影响力更甚核弹。”在第八届互联网安全大会(ISC 2020)上,360董事长兼CEO周鸿祎说道。360董事长兼CEO周鸿祎2020伊始,伴随一系列新基建政策的落地,各行…

b站的服务器在哪个位置,b站用的是哪个云服务器

b站用的是哪个云服务器 内容精选换一换介绍常见的安全组配置示例。如下示例中,出方向默认全通,仅介绍入方向规则配置方法。不同安全组内的云耀云服务器内网互通仅允许特定 IP 地址远程连接云耀云服务器SSH远程连接Linux云耀云服务器RDP远程连接Windows云…

丘成桐讲数学简史(2小时完整视频)

转自:数学杂说中国数学学者对于数学历史大都厥如,数学历史学家的重点在于考古,研究的是中国古代数学的断纸残章,对于古代文献的处理,不如一般歴史学家考证严谨,对于世界数学发展的潮流并不清楚,…

知道一个数组某个index对应的值 不知道下标的情况下删除该值

for (index,item) in Arr.enumerated() {if item item {Arr.remove(at: index)}} 更好的方法是用数组的filter尾随闭包 转载于:https://www.cnblogs.com/liuw-flexi/p/7890643.html

卧龙吟游戏服务器不显示,卧龙吟你必须知道的隐藏特性

卧龙吟有所有特性是没有详细说明或者说容易被大家忽视的,这些都是需要我们去挖掘的,对此,特意奉上辟邪剑谱一本。一,四季系统卧龙吟的时间轴系统中不仅仅是XX年开始可以国战,XX年开始海盗入侵,还有喜闻乐见…

AI芯片发展的前世今生

来源:数学与人工智能,以上文章观点仅代表文章作者,仅供参考,以抛砖引玉!人工智能芯片的分类2.1 传统CPU困局自20个世纪60年代早期开始,CPU(中央处理器)开始出现并使用在计算机工业中。现如今,虽…

华为服务器怎么格式化系统,如何格式化服务器

如何格式化服务器 内容精选换一换已获取该弹性云服务器的密钥文件,如未获取,请参见获取弹性云服务器的密钥文件。弹性云服务器已经绑定弹性IP地址。已配置安全组入方向的访问规则。如果您是在Windows操作系统上登录Linux,可以按照下面方式登录…

防止被算力“锁死”,人工智能进化急需革命性算法

来源:搜狐,以上文章观点仅代表文章作者,仅供参考,以抛砖引玉!“深度学习所需的大规模样本数据对于算力产生巨大需求,但近日美国麻省理工学院等研究机构的报告显示,深度学习正在逼近算力极限&…

Hinton口中破解宇宙终极秘密的GPT-3厉害在哪?这有篇涂鸦详解

大数据文摘出品编译:王绍宇、 AndyGPT-3最近又开始火起一阵,关于GPT-3的各种精彩文章现在也很多,其中不光有展示了它生成结果的,也有对结果一些思考的,还有可视化其工作原理的。由于GPT-3各种参数应用太强大&#xff0…

客户机服务器文件更新,服务端数据更新,如何更新客户端缓存

我是服务端被客户端吐槽说我的API接口没有数据版本号(用来表示后台数据是否有更新),导致客户端缓存不知道什么时候更新,每次都要请求服务端数据对此有几点疑虑,特来请教各位大拿客户端缓存更新是否真的有必要依赖服务端的通知?如果…

c# ref和out参数

向方法传递参的时候,对应的参数通常会用实参的拷贝来初始化。就是说随便在方法内部进行怎样的修改,都不会影响作为参数传递的变量的原始值。 通过上面的例子我们可以看出来,如果一个方法的参数是引用类型,那么使用哪个参数来进行任…

Gartner:如何利用数字孪生帮助企业创造价值?

❑ 导 读白皮书预测:到2021年,半数的大型工业企业将使用数字孪生,从而使这些企业的效率提高10%。到2024年,超过25%的全新数字孪生将作为新loT原生业务应用的绑定功能被采用。全文共计1723,预计阅读时间6分钟来源 | 树根…

ThinkingInJava对this关键字的介绍

this 关键字 如果有两个同类型的对象,分别叫作a 和b,那么您也许不知道如何为这两个对象同时调用一个 f()方法: class Banana { void f(int i) { /* ... */ } } Banana a new Banana(), b new Banana(); a.f(1); b.f(2); 若只有一个名叫f()的…

集成电路将成一级学科,这些高校迎来重大机遇!

来源:软科8月4日,国务院发布关于印发《新时期促进集成电路产业和软件产业高质量发展的若干政策》的通知。《新时期促进集成电路产业和软件产业高质量发展的若干政策》在人才政策这一项中提到:进一步加强高校集成电路和软件专业建设&#xff0…