今天学习到一个不错的内容,那就是分类联动。前面文章有说到ajax的基础知识,今天刚好强化一下所学内容。 来看下效果: 当你选择了“地方网站”的时候就会自动显示字类别的内容“北京”。...下面是html部分代码: 然后就是ajax代码: type //提交方式,默认true是异步 url //提交地址 data //传递数据 datatype //提交类型 在上面js代码中,$(...'#high_id').change(function(){})表示当高级分类的下拉列表值变化时,执行ajax异步提交,提交到get_middle_info的方法中,并且传递high_id参数。
">选择城市 $(document).ready(function () { $.ajax...}); $("#province").change(function () { let b=this.value; console.log(b) $.ajax...{ List allProvince = tAreaService.getByParentcode(code); return allProvince;}以下为原理基础,可略Ajax...使用Ajax技术网页应用能够快速地将增量更新呈现在用户界面上,而不需要重载(刷新)整个页面,这使得程序能够更快地回应用户的操作。...ajax基础Xmlhttprequest对象是AJAX的核心对象,发送请求以及接收服务器数据的返回。Xmlhttprequest对象,现代浏览器都是支持的,都内置了该对象。直接用即可。
接下来进入正题:三级联动(其效果演示可看我的博文 Ajax 学习总结 末尾)。 1....我们先需要从 servlet 转发到 JSP 页面,将所有的 locations 信息封装在 request 中传回 jsp 页面在页面初始化的时候将所有 locations 信息显示 index.jsp...没有departments 则提示对应的消息) selectList.jsp (处理 Ajax 请求部分) <script type="text/javascript" src="${pageContext.request.contextPath...值,locationId var val = $(this).val(); // 如果所选值不是第一个那么就开始执行 Ajax...选择对应的 employee 将其信息打印在页面(在这里我将完成的 jsp 页面和 servlet 代码粘贴在这里) selectList.jsp <%-- Created by
Ajax 技术练习 一、Ajax 实现下拉菜单 1.1 场景再现 1.2 技术分析 1.2.1 前台分析 1.2.2 后台分析 二、让我们来实现它 2.1 前端界面 jsp 2.2 ajax 代码 2.2...使用 xml 传输数据 (servlet 代码) 三、运行截图 一、Ajax 实现下拉菜单 1.1 场景再现 我们在购买快递选择收获地址的时候,选择地域一般都是现选择省,省选择完毕后,电脑会自动显示该省对应的城市...,就使用 ajax 进行交互,得到对应的城市的信息。...把数据写进城市下拉列表当中 1.2.2 后台分析 后端使用 servlet 把数据写死 后端监听前端发过来的数据 判断数据类型,然后经过处理,数据重新封装,返还给前端 二、让我们来实现它 2.1 前端界面 jsp...实现下拉联动title> head> 省份的选择界面p> <option value="-
); xmlHttp.onreadystatechange = showCartIn; xmlHttp.open("GET", "cart.jsp...null); } function showCartIn() { if (xmlHttp.readyState == 4) { /* thus, in this way, it return a jsp
W3C//DTD HTML 4.01 Transitional//EN"> "> My JSP...'index.jsp' starting page $(function(){ //Ajax...}); //下面设置按钮的单击事件; $("#btnLogin").click(function(){ //发送异步请求,设置参数; $.ajax
在JSP页面实现验证码校验文章中当时是使用的Servlet类来进行的验证码校验,但是这种方式并不能即时校验,在正常情况下都是直接在用户输入之后就进行校验,这样对用户来说很方便的。...ajax 是一种浏览器异步发起请求。局部更新页面的技术。...jQuery ajax详解可参阅:jQuery与Ajax ---- 先看效果: 这个刷新验证的原理在JSP页面实现验证码校验已经解释过了,之前说的是跳转到另一个页面进行验证判断用户输入的验证码是否正确...但是这个Ajax的效果是在前端用户输入之后即时进行验证是否正确,并且将相关提示性信息展示在页面。...代码示例: 在jsp页面中是需要先引进一个jQuery的库的: <script src="https://s3.pstatp.com/cdn/expire-1-M/jquery/3.3.1/jquery.min.js
jsp ...; return; } var url = "url"; $.ajax({ type : "post",
首先需要找好JSON的包哦: 链接:http://pan.baidu.com/s/1jH6gN46 密码:lbh1 1:首先创建一个前台页面,比如secondMenu.jsp,源码如下所示: 1...html> 5 6 7 二级菜单联动
最近学习jQuery,所以就写了一个关于中国省市县/区的三级联动菜单,权当相互学习,相互促进,特此记录。 下面是嵌套js的html文件: 三级联动菜单 //生命一个xml变量,用于存储ajax请求返回的xml信息...null; $(function() { showProvince(); }); function showProvince() { //ajax...' + id + '">' + name + ''); }); } 地区显示的三级联动菜单
就绪状态 05发送请求 注意事项 二级联动的实现 实现的效果 代码实现的第一步 第二步,写ajax代码 后端的代码 Ajax响应数据内容 01普通文本(必须掌握) 02json格式(必须掌握) 1...",true); xmlHttp.open(“POST,“exmp1.jsp"); xmlHttp.open("GET", "examp1.jsp?"...要实现的就是这种情况,一个下拉框的变化,导致另一个下拉框里面的内容实现变化 代码实现的第一步 我们首先在jsp页面写两个下拉框 ? 以上的下拉框,第一个下拉框有3个值,第二个下拉框里面什么都没有。...响应数据内容 后端的数据是以什么格式返回给前段的,我们需要知道,二级联动里面,后端是以字符串的形式返回给前段,前段获取后还得自己截取,变为数组,最后获取数据,所以这种很不友好。...01普通文本(必须掌握) out.print("Ajax响应内容"); 二级联动例子里面就是以这种返回数据,以这种方式返回的数据是一个list集合 前段的ajax就是以这种进行获取 var
Ajax实现省市区三级联动 思路: (1)首先获取省份信息 (2)发起Ajax请求,注意dataType中的T大写 (3)封装回调函数,回调函数success中用$.each循环每一条数据,动态创建option...doctype html> 2 3 4 5 省市区三级联动</...function() { 30 //获取列表数据的通用方法 31 function getList(code,flag,callback){ 32 $.ajax...DOCTYPE html> 2 3 4 5 省市区三级联动 29 $(function(){ 30 function callback(id,code,flag){ 31 $.ajax
之前的一篇介绍过关于salesforce手动配置关联关系实现PickList的联动效果,但是现实的开发中,很多数据不是定死的,应该通过ajax来动态获取,本篇讲述通过JavaScript Remoting...方式实现联动效果。...RemoteAction 3 public returnType myFunction(param1,param2) { 4 //returnType为方法需要返回的类型 5 } 6 } 二.联动制作
1.jsp跳转jsp jsp1代码 <%-- Created by IntelliJ IDEA..... --%> ajax... jsp"> 用户名:...跳转servlet跳转jsp jsp1页面代码 <%-- Created by IntelliJ IDEA....Templates. --%> ajax
了解JSP JSP 本质上就是⼀个 Servlet,JSP 主要负责与⽤户交互,将最终的界⾯呈现给⽤户。 在Java中,只有Servlet接口才可以于浏览器交互。...JSP引擎会将你写好了的jsp转化为Java类,也就是Servlet类,如果你去看他转化之后的源代码,你会发现它实际上就是我们之前使用原始Servlet的servletResponse.getWriter...换句话说,当服务器接收到⼀个后缀是 jsp 的请求时,将该请求交给 JSP 引擎去处理,每⼀个 JSP 页面第⼀次被访问的时候,JSP 引擎会将它翻译成⼀个 Servlet ⽂件,再由 Web 容器调⽤...嵌入方式 1.JSP 脚本,执⾏ Java 逻辑代码 我们去新建一个JSP页面,就叫test.jsp,运行项目后在浏览器中访问该页面。...page:当前 JSP 对应的 Servlet 对象,Servlet。 exception:表示 JSP 页面发⽣的异常,Exception。很少用到。
在JSP中,request和response是非常重要的两个东西,请务必知道他们的常用方法。...我们对前四个方法做一个小案例,首先我们建立几个jsp页面,分别叫hello1,hello2,hello3 我们让hello1获取一个name参数,保存到key为name中,然后转发给hello2.jsp...,hello2不做处理直接转发给hello3.jsp,相关代码如下 hello1.jsp 我是Hello1 我们启动项目,到浏览器中访问hello1.jsp,会发现其实访问的是hello3.jsp中的内容,但是地址栏不改变,name值也成功取出来。...,所以我们需要去写这个jsp,我们在里面加入验证用户名密码的功能,如果正确就转发给welcome.jsp,因为转发才可以传递request。
jQuery ajax - ajax() 方法 http://www.w3school.com.cn/jquery/ajax_ajax.asp jQuery Ajax 参考手册 实例 通过 AJAX 加载一段文本...语法 jQuery.ajax([settings]) 参数 描述 settings 可选。用于配置 Ajax 请求的键值对集合。...这是一个 Ajax 事件。如果返回 false 可以取消本次 ajax 请求。...这是一个 Ajax 事件。 global 类型:Boolean 是否触发全局 AJAX 事件。默认值: true。...设置为 false 将不会触发全局 AJAX 事件,如 ajaxStart 或 ajaxStop 可用于控制不同的 Ajax 事件。
1 JSP概述 1.1 什么是JSP JSP(Java Server Pages)是JavaWeb服务器端的动态资源。它与html页面的作用是相同的,显示数据和获取数据。...1.2 JSP的组成 JSP = html + Java脚本(代码片段) + JSP动态标签 ?...所以JSP其实就是一个Servlet! ? ? 3.2 JSP真身存放目录 JSP生成的Servlet存放在${CATALANA}/work目录下,我经常开玩笑的说,它是JSP的“真身”。...[崔9]JSP页面中的内容都会在这个位置出现!这时上面所说的对象已经创建完了,所以在JSP页面中是可以使用的。 4 再论JSP脚本 JSP脚本一共三种形式: l 中的内容在JSP编译成.java时会被忽略的,即JSP注释。 也可以在JSP页面中使用html注释:<!
本章内容只对JSP内容做入门介绍,是为了会话技术的Cookie和Session内容的承接,后续再写文章详细介绍JSP。...1 JSP基本概念 JSP,Java Server Pages,Java服务器端界面,可以理解为一个特殊页面,既可以定义html标签,又可以定义Java代码。可以简化书写!...【JSP原理】:JSP本质上就是一个Servlet 1)服务器解析请求消息,找是否有index.jsp资源; 2)若找到了,则将其转化为.java文件; 3)编译.java文件,生成.class字节码文件...2 JSP脚本 JSP脚本,就是JSP定义Java代码的方式,有三种: 1):定义的java代码,在service方法中,service中可以定义什么,该脚本中就可以定义什么;...3 JSP的内置对象 内置对象,就是指在jsp页面中不需要获取和创建,可以直接使用的对象。
JSP就是用来专门处理这种需求的。 JSP概述 JSP (Java Server Page):Java 服务端页面。...jsp可以很方便的在页面中通过java代码嵌入动态页面 JSP原理分析 下面是一个简单的hello world程序 jsp.java、index_jsp.class 下面是这个jsp生成的部分源码 package org.apache.jsp...本质上还是一个Servlet类,当我们第一次访问这个jsp页面时,服务器会根据jsp代码生成一个Servlet类的.java源码文件然后编译。...jsp语法 jsp确实简化了用户界面的编写,但是如果只知道原理,而不知道如何使用它仍然是白瞎,这部分来简单聊聊如何使用它 jsp的代码主要放在3种标签中 : 这种格式中的代码,主要放的是要执行的