使用Ajax由html向Servlet传值

HTML动态响应2-Servlet+Ajax实现HTTP前后台交互方式 WEb项目经常需要前后端交互数据,并动态修改HTML页面,网上没有完整的案例,本文讲述客户端传递参数给后端,后端处理后返回前端,由前端根据返回的数据做图像处理 阅读详情
前端代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>title</title>
<script type="text/javascript">

	function createXMLHttpRequest() {
		var XMLHttpRequest1;
		if(window.XMLHttpRequest) {
			XMLhttpRequest1 = new XMLHttpRequest();
		}else if(window.ActiveXObject) {
			try{
				XMLHttpRequest1 = new ActiveXObject();
			}catch(e){
				XMLHttpRequest1 = new ActiveXObject("MicroSoft.XMLHTTP");
			}
		}
		return XMLHttpRequest1;
	}
	
	function ajax() {
		var param1 = document.getElementById("param1").value;
		var param1 = document.getElementById("param1").value;
		var XMLHttpRequest1 = createXMLHttpRequest();
		var url = "./AjaxServlet"
		XMLHttpRequest1.open("POST",url,true);
		XMLHttpRequest1.setRequestHeader("Content-type","application/x-www-form-urlencode");
		XMLHttpRequest1.send("param1="+param1+",param2="+param2);
		XMLHttpRequest1.onreadystatechange = function() {
			if(XMLHttpRequest1.readyState == 4) {
				if(XMLHttpRequest1.status == 200) {
					alert(XMLHttpRequest1.responseText);
				}else{
					alert("网络连接中断!");
				}
			}
		};
	}
</script>
</head>
<body>
<input type ="text" id="param1">
<input type ="text" id = "param2">
<button onclick = "ajax();">Go!</button>
</body>
</html>

Servlet代码:

package com.jmd.bingo;

import java.io.IOException;
import java.io.PrintStream;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;


public class AjaxServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
    public AjaxServlet() {
        super();
        }


	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		PrintStream out = new PrintStream(response.getOutputStream());
		response.setContentType("text/html;charset = utf-8");
		out.print("请正常打开网页!");
	}

	
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		request.setCharacterEncoding("utf-8");
		String param1 = request.getParameter("param1");
		String param2 = request.getParameter("param2");
		response.setContentType("text/html;charset = utf-8");
		PrintWriter pw = response.getWriter();
		pw.print("前台传来了参数:parameter1 ="+param1+",parameter2 = "+param2);
		pw.flush();
		pw.close();
		
	}

}


用ajax实现html与servlet的数据交互 实验环境 jdk8,Version: Mars Release (4.5.0) 其中有原始的以ajax方式实现html与servlet的交互 也包括了使用Jquery Ajax实现交互,包括以get方式提交时候乱码问题的处理。 立即下载

相关推荐

Moveit +Gazebo:搭建单臂机械臂仿真平台

Moveit +Gazebo:搭建单臂机械臂仿真平台

magic_invaid的博客 5290

html向servlet传递数据,ajax实现在html的table里面手动输入多个数据并传入servlet层...

1. 针对的问题前端页面为html页面,由于是静态页面,数据的传入传出都必须引入ajax来实现。这里主要实现按键触发,调用servlet层的Java代码,完成html页面手动输入数据(输入较多数据)并传向后台。2. 解决方法(1) html页面(文件名index.html)板号CH01CH02CH03CH04CH05CH06CH07CH08CH09CH10CH11CH12CH13CH14CH15C...

weixin_33256233的博客 2824

《解锁GCC版本选择的奥秘:从入门到精通》

GCC 版本的选择是一项复杂而关键的决策,犹如一场精心策划的战略布局,贯穿于软件开发的整个生命周期。从项目需求与兼容性的深度考量,到性能与稳定性的权衡抉择,再到硬件与系统适配的精准对接,每一个环节都紧密相连,相互影响。在游戏开发行业,对性能的极致追求促使开发者青睐较新的 GCC 版本,以实现更流畅的游戏体验和更震撼的视觉效果;科学计算领域则依赖于 GCC 版本对复杂数学运算的高效优化,以应对大规模数据处理的挑战;嵌入式开发行业因硬件资源的限制和对稳定性的严苛要求,通常选择经过长期验证的稳定版本;

zheng_ruiguo的专栏 1418

Servlet获取前端提交的参数

学好Servlet必须紧紧围绕着请求和响应这两个概念 以上写的代码只是进行请求,然后再响应到客户端。请求的时候没有带数据给Servlet 下面开始写在请求的时候前端带数据到servlet里面,我们servlet要接收前端给我们的这个数据。

qq_63242968的博客 601

lattice Diamond Programmer程序下载

Lattice Diamond Programmer(支持Lattice FPGA与CPLD程序下载)

qq_44385725的博客 5177

PCL 法线定向【2025最新版】

几种法线定向方法的PCL代码实现。

点云侠的博客 2805

js从html获取提交给servlet,servlet把值返回html 出现中文乱码

js: $("#verifyButton").click(function(){ var username=$("#username").val(); if(username==""){ alert("用户名不能为空!"); }else{ $.get("servlet/userVerifyServlet?username="+username,null,function(response){ 

ning313180989的专栏 6584

Vue3 - 详细实现虚拟列表前端虚拟滚动列表解决方案,vue3长列表优化之虚拟列表,解决列表动态高度不固定高度及图片视频图文异步请求加载问题,虚拟列表DOM大量数据同时加载渲染卡顿太慢及下滑列表闪烁

vue3,vue3虚拟列表,用vue3实现一个虚拟列表,长列表高度不一致如何实现虚拟滚动加载列表,虚拟列表有图片视频,图文列表,上万条数据同时渲染解决,长列表dom渲染太卡,列表滚动条加载超多数据,瀑布流,在Vue3中如何实现列表的虚拟滚动,虚拟列表滑动白屏闪烁闪一下,虚拟列表每个项的高度不确定,可动态改变高度,vue3虚拟滚动列表,页面数据太多加载很慢怎么办,vue3实现不定高的虚拟列表,定高和不定高,虚拟列表非固定高度,vue3长列表优化之虚拟列表实现,vue3虚拟列表高度不固定,用vue3实现一个虚拟

🏆 前端领域优质创作者 1万+

JavaWeb中使用html和servlet的传值过程

在HTML的超链接传值 格式:在超链接通过?+要传的属性名=属性值 ,多个属性需要用&连接<a href="servlet?username=啊啊啊">点击调用doGet()1方法</a> <a href="servlet?username=啊啊啊&password=123">点击调用doGet()2方法</a>传递的值在servlet中使用: request.getParam

qingyisuo的博客 1万+

面试提问:数据开发中如何通过指标拆解来指导SQL编写?(附拆解模板)

摘要:指标拆解是一种高效的数据分析方法,通过将复杂业务指标分解为可执行的原子指标,指导SQL查询的编写。核心步骤包括:明确指标定义、拆解原子指标、定位数据源、确定分组维度、构建中间表。文章提供了指标拆解模板和实际案例(如用户留存率计算),并总结了拆解带来的5大好处:逻辑清晰、易于调试、可复用、降低错误率、便于协作。最后强调"一定义、二拆解、三定位、四分步、五合并"的口诀,适用于数仓开发、BI报表等场景。

石榴姐yyds 267

量化交易 米筐 案例:市值因子选股策略

案例:市值因子的选股策略 1.结果 获得超额收益 年化 49% 2. 从股票中选择市值小的股票 选定财务数据筛选 进行每日调仓(多因子选股调仓 周期频率会小一些) 3. 代码 估值有关指标 # 在沪深300股票中,选出市值比较小的10只股票 # 在这个方法中编写任何的初始化逻辑。context对象将会在你的算法策略的任何方法之间做传递。 def init(context): # 沪深300组合 stocks = index_components('000300.XSHG') # 沪深3

廷益_飞鸟的博客 2313

Ajax 发送数据到 Servlet

本文介绍了 Ajax 发送数据到 Servlet 的相关内容。。。

Regino的博客 1727

vxWorks下dosFs文件系统的创建

文件系统,是指操作系统根据目录和文件的组织形式在磁盘设备上应用的一种设备驱动,不同的文件系统对目录和文件有不同的限制(如目录名限制,文件大小限制等)。VxWorks支持多种文件系统,比较重要的有:1、dosFs:适用于块存取设备(比如硬盘、软盘),和MS-DOS文件系统兼容;2、rawFs:提供了一种简单的原始文件系统。该文件系统将整个硬盘当作一个单独的大文件;3、cdromFs:允许系统从按照I

技术联盟 1万+

使用Echarts绘制折线图实例,ajax传值给servlet后台

使用Echarts绘制折线图实例,ajax传值给servlet后台,废话不多说,上代码project-duanmianlishi.jsp页面:&lt;%@page import="java.sql.DriverManager"%&gt;&lt;%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="U...

weixin_40463857的博客 1781

NTscan扫描工具

ntscan是一个扫描器,可以扫描没有密码和弱密码的共享,先到配置文件中填写猜测的用户名和密码,扫描过程中右侧出现的是扫描日志。

C# WinForm 基于DirectShow.dll编写的程序,可边预览边保存视频,音频和图片

基于微软的DirectShow.dll的二次开发1.自动识别连接的摄像头跟麦克风且可以对其进行选择(默认选中第一个)2.可录制wmv和avi两种格式的视频并且都带有音频,avi可以录制的分辨率和帧数进行选择,wmv默认进行了淸晰度优化如不喜欢可去除代码中有相关提示3.可在预览点开之后进行拍照,也可边录制视频边拍照4.添加了视频和音频的压缩功能(酌情使用)这次二次开发发现C#对DirectShow的相关信息太少,这次做完也不敢藏私共享出来,还望大家指正

ajax html页面传值乱码,jQuery Ajax传值到Servlet出现乱码问题的解决方法

最近在学jquery ui,在做一个小功能的时候需要将前台的值获取到,通过Ajax传递给Servlet,然后再在返回数据结果,但是在Servlet接受参数的时候,通过后台打印,发现接受乱码,代码示例如下:public void doGet(HttpServletRequest request, HttpServletResponse response)throws ServletException...

weixin_42433529的博客 316

STM32F407中文手册

STM32f407中文手册 本参考手册面向应用开发人员,提供有关使用 STM32F405xx/07xx、STM32F415xx/17xx、 STM32F42xxx 和 STM32F43xxx 微控制器存储器与外设的完整信息。STM32F405xx/07xx、STM32F415xx/17xx、STM32F42xxx 和 STM32F43xxx 构成一个微 控制器系列,各产品具有不同的存储器大小、封装和外设。有关订购信息以及器件的机械与电气特性,请参见数据手册。有关 ARM Cortex™-M4F 内核的信息,请参见《Cortex™-M4F 技术参考手册》。

Ajax向Servlet传值小实例

Ajax向Servlet传值小实例通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。下面是使用Ajax向后台Servlet传递JSON格式的数据的一个小实例。Ajax接收后台Servlet传过来的json数据请参考:http://blog.youkuaiyun.com/u010371710/article/details/46

我的优快云 2万+

IMSL CNL 7.0.0 (x86-64)Crack

IMSL CNL 7.0.0 (x86-64)Crack intel的算法库破解文件,这是C++版本的破解文件

jsp用ajax传值给servlet并返回

1、index.jsp <%-- Document : index Created on : 2017-9-26, 22:27:13 Author : Administrator --%> JSP Page

qq_28562411的博客 7205

ajax传参数json对象到servlet获取

JSP登陆界面代码: &lt;%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%&gt; &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="ISO-8859-

qq_41172982的博客 1663

【Servlet】servlet类通过Ajax从html页面获取JSON对象

1 准备Student实体类 package bean; public class Student { private int id; private String name; public int getId() { return id; } public void setId(int id) { this.id = id; } public String getName() { return n

Awt_FuDongLai的博客 719

ajax异步请求servlet之后,为什么html里面显示不了值

作为刚开始学习的小白,遇到了一点问题,好在都解决了,现在分享出来,希望可以帮助大家。 servlet部分: protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType...

weixin_44957370的博客 342

Ajax+Servlet实现简单的HTML/JSP异步加载

项目地址 https://gitee.com/yyyyys/stockWebServlet(Server Applet)是Java Servlet的简称,称为小服务程序或服务连接器,用Java编写的服务器端程序,主要功能在于交互式地浏览和修改数据,生成动态Web内容。(百度百科)Ajax 即“Asynchronous Javascript And XML”(异步 JavaScript 和 XML)...

Timidvb 1527

使用 javascript 通过 AJAX 向 servlet 发出 HTTP 请求示例

这篇文章解释了 Ajax 的基础知识以及如何使用 javascript 通过 AJAX 向 servlet 发出 HTTP 请求。 Ajax(异步 Javascript 和 XML)是一种我们可以在 Web 开发中使用的技术,用于创建更快的用户界面更新和更好的用户体验。Ajax 使用 XMLHttpRequest 对象与服务器进行通信。使用 ajax,用户可以在不提交页面或重新加载浏览器页面的情况下将数据发布到后端服务器。使用 servlet 创建 AJAX 示例应用程序非常简单。 在这篇文章

allway2的博客 4250

ajax请求servlet小练习(一)

在我们以往的工作中,发送ajax都是借助框架(比如SpringMVC)来实现的,最近在做公司的一个需求,就是在一个工程中查询数据库,但是这个工程没有引入Spring相关的框架,我不想用form表单提交的方式去实现,就想写一个简单的servelt,发送ajax请求访问这个servlet,servlet再去访问数据库,之后将查询到的结果返回到页面。我将此工作分为了两部。 第一步,发送aj...

liuying1802028915的博客 5363

使用JQuery的$.ajax()方法请求Servlet

如果在form内,就不要写和,会提交表单刷新页面json的键/值对用逗号隔开,不能用分号dateType是预期服务器返回的数据类型(html,script,json,text等),dateType指定的是什么类型,servlet就要返回什么类型建议使用Jackson、gson、fastjson等类库dataType错误类型错误:后台返回的dataType类型和前台写的不一致会跳入error。

Hi there 6248

HTML、CSS、JS、JSP、Servlet、ajax、JSTL的区别

索引HTMLCSSJavaScriptJSPservletajaxJSTL使用JSTL : HTML HTML是一种超文本标记语言,用来结构化我们的网页内容并赋予内容含义,例如定义段落、标题、数据表、或在页面中嵌入图片和视频 xml是可扩展标记语言,xml是一套定义语意标记的规则,xml标签没有预定义、需自行定义标签, xml被设计用来传输和存储数据,其焦点是数据的内容。 HTML被设计用来显示数据,其焦点是数据的外观 CSS 是一种样式规则语言 可将样式应用于HTML内容,例如设置背景颜色,字体,

〆`杨陆原じ₯㎕ 1449

【Servlet】html页面通过Ajax从servlet类获取一个实体对象

相关文章: 【Servlet】通过Ajax获取JSON对象 重复步骤在本文就省略了,如实体类,js文件和jar包导入,配置web.xml。 1 概览 本文的主要操作是: 在servlet类中,生成一个实体对象,将其转化为JSON对象。 将这个JSON对象传到html页面上,通过JS代码解析,将其显示出来 2 准备getOne.html页面 说明: 点击id="sender"的按钮后,触发$(’#sender’).click(function () {…});事件。 $.post(…);表示以post的

Awt_FuDongLai的博客 621
上一篇: Java IO操作
下一篇: Ajax基本用法
bingoCoder
博客等级 码龄10年 1400粉丝 157原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值