Web---myAjax(自己写底层)-隐藏帧技术
讲解网站一般都有的一个功能，就是注册时候的，实现验证用户名是否存在的功能。
源代码演示：
reg.jsp:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>myAjax</title>
<script type="text/javascript">
function val(obj){
var name = obj.value;//.value就是input中的name属性值
if(name!=null&&name!=""){
document.getElementById("regName").value=name;
document.forms[1].submit();//让第二个表单提交
}else{
msg.innerHTML="请输入用户名！";
}
}
function ajaxBack(res){
if(res==1){
parent.document.getElementById("msg").innerHTML="用户名已经存在，请更换用户名！";
}else{
msg.innerHTML="恭喜，可以注册！";
//id也可以直接这样用
}
}
</script>
</head>
<body>
<h2>演示myAjax---隐藏帧技术</h2>
<br/>
<h2>用户注册</h2>
<form action="<%= request.getContextPath() %>/RegServlet" method="post">
Name:<input type="text" name="name" onblur="val(this)"/>
<label id="msg" style="color:red;"></label><br/>
Password:<input type="password" name="pwd"/><br/>
Tel:<input type="text" name="tel"/><br/>
<input type="submit" value="注册">
</form>
<form target="dataFrame" action="<%= request.getContextPath() %>/ValServlet" method="post">
<input type="hidden" id="regName" name="name"/>
<!-- type="hidden" 表示这个input是隐藏的，网页不可见. target 属性规定在何处打开 action URL。 -->
</form>
<!-- iframe创建包含另外一个文档的内联框架（即行内框架）。 -->
<iframe style="display:none" name="dataFrame" ></iframe>
</body>
</html>
web.xml:
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="3.0"
xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd">
<display-name></display-name>
<servlet>
<servlet-name>RegServlet</servlet-name>
<servlet-class>cn.hncu.reg.servlet.RegServlet</servlet-class>
</servlet>
<servlet>
<servlet-name>ValServlet</servlet-name>
<servlet-class>cn.hncu.reg.servlet.ValServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>RegServlet</servlet-name>
<url-pattern>/RegServlet</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>ValServlet</servlet-name>
<url-pattern>/ValServlet</url-pattern>
</servlet-mapping>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app>
RegServlet.java:
package cn.hncu.reg.servlet;
import java.io.IOException;
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 RegServlet extends HttpServlet {
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=utf-8");
PrintWriter out = response.getWriter();
request.setCharacterEncoding("utf-8");
String name = request.getParameter("name");
String ped = request.getParameter("pwd");
String tel = request.getParameter("tel");
if(name.startsWith("hncu")){//如果是正式做，这里要去后台进行注册，这里简化了。
out.print("注册成功！"+name);
}else{
out.print("注册失败：用户名必须以hncu开头");
}
}
}
ValServlet.java:
package cn.hncu.reg.servlet;
import java.io.IOException;
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 ValServlet extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doPost(request, response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=utf-8");
PrintWriter out = response.getWriter();
request.setCharacterEncoding("utf-8");
String name = request.getParameter("name");
String pwd = request.getParameter("pwd");
String tel = request.getParameter("tel");
if(name!=null && name.trim().length()>0 && name.startsWith("hncu") ){//正式项目，需要去后台校验数据的
request.setAttribute("error", 0);//这是可以注册的
}else{
request.setAttribute("error", 1);//不能注册，该用户名已经存在！
}
//转发
request.getRequestDispatcher("/jsps/regResult.jsp").forward(request, response);
}
}
regResult.jsp:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
</head>
<body>
<h2>这是结果页面</h2>
错误代码：${error }
<script type="text/javascript">
var res ="<%=request.getAttribute("error")%>";
/*
if(res==1){
parent.document.getElementById("msg").innerHTML="用户名已经存在，请更换用户名！";
}else{
parent.document.getElementById("msg").innerHTML="恭喜，可以注册！";
}
//parent.document--表示父页面的document对象
//这种方式可以用，但不是很好。我们最好用下面那一句调用父页面的方法解决
*/
parent.ajaxBack(res);
</script>
</body>
</html>
演示结果：
真正的实现之后，是这样的：
Web---myAjax(自己写底层)-隐藏帧技术的更多相关文章
- [Java Web] 1、Web开发初识——一大堆历史和技术名词
LZ前言 LZ最近发现网络真是个神奇的东西,以前做的好玩的只能自娱自乐(或者说顾影自怜),现在只要发一个帖子,写一个博客,很快能引来一大群小伙伴的围观(有时候还能遇见几个大牛给个战略性的指导)...L ...
- 关于基于.net的WEB程序开发所需要的一些技术归纳
前提: 最近公司里有一个同事,年龄比我大几岁,但是由于是转行来做开发的,许多的关于.net开发技术不是很入行,所以总是会问我一些东西,基于自己以前的一些 经验,总是会愿意给他讲一些总结性的东西,希望他 ...
- Web高级征程：《大型网站技术架构》读书笔记系列
一.此书到底何方神圣? <大型网站技术架构:核心原理与案例分析>通过梳理大型网站技术发展历程,剖析大型网站技术架构模式,深入讲述大型互联网架构设计的核心原理,并通过一组典型网站技术架构设计 ...
- PHP Web实时消息后台服务器推送技术---GoEasy
越来越多的项目需要用到实时消息的推送与接收,怎样用php实现最方便呢?我这里推荐大家使用GoEasy, 它是一款第三方推送服务平台,使用它的API可以轻松搞定实时推送! 浏览器兼容性:GoEasy推送 ...
- Ruby Web实时消息后台服务器推送技术---GoEasy
越来越多的项目需要用到实时消息的推送与接收,怎样用Ruby实现最方便呢?我这里推荐大家使用GoEasy, 它是一款第三方推送服务平台,使用它的API可以轻松搞定实时推送! 浏览器兼容性:GoEasy推 ...
- Win32之隐藏DLL隐藏模块技术
Win32之隐藏DLL隐藏模块技术 这一讲涉及到windows底层技术.跟汇编内容. 我们才可以实现模块隐藏(也称为DLL隐藏) 一丶API反汇编勾引兴趣 我们都用过Windows的进程跟线程API ...
- Web项目开发中用到的缓存技术
在WEB开发中用来应付高流量最有效的办法就是用缓存技术,能有效的提高服务器负载性能,用空间换取时间.缓存一般用来 存储频繁访问的数据 临时存储耗时的计算结果 内存缓存减少磁盘IO 使用缓存的2个主要原 ...
- 现代web开发需要学习的15大技术
现代Web开发需要学习的15大技术 2016-06-08 13:08 快进到现在,我发现现代web开发再一次将发生压倒性的改变.信息资讯的铺天盖地令人迷惑,尤其对于初学者而言.首要原因是新的框架,例如 ...
- 2018年一名合格的web前端程序员应该会哪些技术
有朋友让小编说一说web前端在未来几年的发展趋向,对于这个问题,恕小编无能为力,web前端技术日新月异,更新非常快,谁也不能预料未来会发生些什么 小编也只能说在2018年,react native和j ...
随机推荐
- 创建一个cocos2d-x工程添加一个自定义Scene并显示
#include "cocos2d.h" class RunScene :public cocos2d::CCLayer { public: virtual bool init() ...
- PHPExcel说明
下面是总结的几个使用方法include 'PHPExcel.php';include 'PHPExcel/Writer/Excel2007.php';//或者include 'PHPExcel/Wri ...
- PHP学习心得（六）——变量
PHP 中的变量用一个美元符号后面跟变量名来表示.变量名是区分大小写的.一个有效的变量名由字母或者下划线开头,后面跟上任意数量的字母,数字,或者下划线.$this 是一个特殊的变量,它不能被赋值.PH ...
- 推荐一款java的验证码组件——kaptcha
使用方法: 项目中导入kaptcha-2.3.jar包 在web.xml里面新增: <!-- 登陆验证码Kaptcha --> <servlet> <servlet- ...
- python连接zookeeper的日志问题
用python连接zookeeper时,在终端里,一直会有zookeeper的日志冒出来,这样会很烦. -- ::,:(: Exceeded deadline by 11ms 解决方法是在连接后设置一 ...
- codeforces 630K - Indivisibility
K. Indivisibility 题意:给一个n(1 <= n <= 10^18)的区间,问区间中有多少个数不能被2~10这些数整除: 整除只需要看素数即可,只有2,3,5,7四个素数: ...
- Bootstrap优秀网站：乐窝网
Bootstrap优秀网站:乐窝网 调用谷歌在线地图的API和Bootstrap工具包实现了租房和出租的一个平台. 佩服之极,09年跟一个哥们聊天时,他就提议过这方面的应用,终于看到有人实现了,祝贺. ...
- @Transient注解
以下两个包都包含@Transient注解 java.beans.Transient; javax.persistence.Transient; 使用@Transient时注意区别二者
- Linux下相关查找文件命令(find locate which whereis type)
以下内容摘自:http://blog.csdn.net/jessica1201/article/details/8139249 标注的内容为自己的补充: 我们经常需要在系统中查找一个文件,那么在lin ...
- 上传项目到Github
1.使用根工具(均是图形化的界面) TortoiseGit-1.8.12.0-32bit GitExtensions-2.48.05-SetupComplete 2.大致步骤 首先,你需要一个Gith ...