html上传用户名到数据库,Ajax案例-基于HTML，以GET或POST方式，检查注册用户名是否在数据库中已存在...

08_register.jsp

基于HTML，以GET或POST方式，检查注册用户名是否在数据库中已存在

用户名[GET]：

光标移出后，立即检查结果

---

//创建AJAX异步对象，即XMLHttpRequest

function createAJAX(){

var ajax = null;

try{

ajax = new ActiveXObject("microsoft.xmlhttp");

}catch(e1){

try{

ajax = new XMLHttpRequest();

}catch(e2){

alert("你的浏览器不支持ajax，请更换浏览器");

}

}

return ajax;

}

//定位文本框，同时提供焦点失去事件

document.getElementById("usernameID").onblur = function(){

//获取文本框中输入的值

var username = this.value;

//如果用户没有填内容

if(username.length == 0){

//提示

document.getElementById("resID").innerHTML = "用户名必填";

}else{

//对汉字进行UTF-8(U8)的编码

username = encodeURI(username);

//NO1)

var ajax = createAJAX();

//NO2)

var method = "GET";

var url = "${pageContext.request.contextPath}/UserServlet?time="+new Date().getTime()+"&username=" + username;

ajax.open(method,url);

//NO3)

ajax.send(null);

//--------------------------------------------------------等待

//NO4)

ajax.onreadystatechange = function(){

if(ajax.readyState == 4){

if(ajax.status == 200){

//NO5)

var tip = ajax.responseText;

//NO6)

document.getElementById("resID").innerHTML = tip;

}

}

}

}

}

09_register.jsp

基于HTML，以GET或POST方式，检查注册用户名是否在数据库中已存在

用户名[POST]：

---

document.getElementById("usernameID").onblur = function(){

var username = this.value;//杰克

//NO1)

var ajax = createAJAX();

//NO2)

var method = "POST";

var url = "${pageContext.request.contextPath}/UserServlet?time="+new Date().getTime();

ajax.open(method,url);

//设置AJAX请求头为POST，他会将请求体中的汉字自动进行UTF-8的编码

ajax.setRequestHeader("content-type","application/x-www-form-urlencoded");

//NO3)

var content = "username=" + username;

ajax.send(content);

//===========================================等待

//NO4)

ajax.onreadystatechange = function(){

if(ajax.readyState == 4){

if(ajax.status == 200){

//NO5)

var tip = ajax.responseText;

//NO6)

//创建img标签

var imgElement = document.createElement("img");

//设置img标签的src/width/height的属性值

imgElement.src = tip;

imgElement.style.width = "12px";

imgElement.style.height = "12px";

//定位span标签

var spanElement = document.getElementById("resID");

//清空span标签中的内容

spanElement.innerHTML = "";

//将img标签加入到span标签中

spanElement.appendChild(imgElement);

}

}

}

}

package loaderman.user;

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;

/**

* 基于HTML，以GET或POST方式，检查注册用户名是否在数据库中已存在

*/

public class UserServlet extends HttpServlet {

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

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

byte[] buf = username.getBytes("ISO8859-1");

username = new String(buf,"UTF-8");

System.out.println("username=" + username);

String tip = "可以注册";

if("杰克".equals(username)){

tip = "该用户已存在";

}

response.setContentType("text/html;charset=UTF-8");

PrintWriter pw = response.getWriter();

pw.write(tip);

pw.flush();

pw.close();

}

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

request.setCharacterEncoding("UTF-8");

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

System.out.println("username=" + username);

String tip = "images/MsgSent.gif";

if("杰克".equals(username)){

tip = "images/MsgError.gif";

}

response.setContentType("text/html;charset=UTF-8");

PrintWriter pw = response.getWriter();

pw.write(tip);

pw.flush();

pw.close();

}

}

Ajax案例-基于XML，以POST方式，完成省份-城市二级下拉联动

...

js调用ajax案例

js调用ajax案例 测试地址:http://www.w3school.com.cn/tiy/t.asp?f=ajax_get 嵌入下面代码,点击提交,再点击请求数据.就可以看到结果了.

Django-website 程序案例系列-6 ajax案例

普通ajax案例: views.py def testajax(request): h = request.POST.get('hostname') #拿到ajax传来的值 i = request.P ...

分布式事务之——tcc-transaction分布式TCC型事务框架搭建与实战案例(基于Dubbo/Dubbox)

转载请注明出处:http://blog.csdn.net/l1028386804/article/details/73731363 一.背景 有一定分布式开发经验的朋友都知道,产品/项目/系统最初为了 ...

AJAX是基于现有的Internet标准

AJAX是基于现有的Internet标准 AJAX是基于现有的Internet标准,并且联合使用它们: XMLHttpRequest 对象 (异步的与服务器交换数据) JavaScript/DOM ( ...

Django---CSRF的装饰器,CSRF的流程,JSON数据格式,ajax技术(基于JQ实现)

Django---CSRF的装饰器,CSRF的流程,JSON数据格式,ajax技术(基于JQ实现) 一丶CSRF相关的装饰器 from django.utils.decorators import m ...

ajax案例_校验用户名

目录 ajax案例_校验用户名 代码下载 需求 流程 搭建环境 开发代码 1_jsp 1_servlet 1_service.dao 2_servlet 2_jsp 测试后,功能实现,完结撒花 aja ...

数据挖掘案例:基于 ReliefF和K-means算法的应用

数据挖掘案例:基于 ReliefF和K-means算法的应用 数据挖掘方法的提出,让人们有能力最终认识数据的真正价值,即蕴藏在数据中的信息和知识.数据挖掘(DataMiriing),指的是从大型数据库 ...

随机推荐

理解Web标准(网站标准)

我觉得一名Web前端应该好好理解Web标准到底是什么,为什么要在我们的实际实践中遵循Web标准. 什么是Web标准.百度百科的解释是: WEB标准不是某一个标准,而是一系列标准的集合.网页主要由三部分 ...

DotNetBar怎样控制窗口样式

DotNetBar怎样控制窗口样式 老帅  在C#中使用控件DevComponents.DotNetBar时,怎样创建一个美丽的窗口.并控制窗口样式呢? 1.新建一个DotNetBar窗口       ...

CURL post/get提交

public function curlss($url){ $curl = curl_init(); // 设置你需要抓取的URL curl_setopt($curl, CURLOPT_URL, $u ...

【learning】一种奇妙的网络流建模方式

吐槽 好吧这个是真的很妙qwq用来解方程组的网络流嗯不能更清真 正题 首先是大概描述 当一个方程组中所有的方程相加之后可以把所有的变量都消掉(也就是所有变量都出现一正一负可以抵消掉),我们会发现这个其 ...

figlet

figlet https://aotu.io/notes/2016/11/22/figlet/  教程 npm i figlet --save-dev var figlet = require('fi ...

图片编辑工具GIMP

今天修改图片: 给图片添加alpha通道,选中要删去的部分,就会变成透明,要保存为png格式 文库参考: http://wenku.baidu.com/link?url=HR1lKoBKS1xbhUJ ...

cf- Educational Codeforces Round 40 -D

题意:给你n个点,m条边,一个起点s,一个终点t的无向图,问在某两个点之间加一条边,不改变s到t的最短路径的值的加法有多少种,所有点一定连接: 思路:首先,默认相邻两点的权值都为1,会改变值的情况有: ...

Android application 和 activity 标签详解

extends:http://blog.csdn.net/self_study/article/details/54020909 Application 标签 android:allowTaskRep ...

Spring Boot 数据库连接池 Druid

简介 数据库连接是一种关键的有限的昂贵的资源,这一点在多用户的网页应用程序中体现得尤为突出.对数据库连接的管理能显著影响到整个应用程序的伸缩性和健壮性,影响到程序的性能指标.数据库连接池正是针对这个问 ...

java unicode转码为中文　实例

package com.infomorrow.parser_report; import org.junit.Test; public class Decode { @Test public void ...