转贴:JavaScript实现Ajax请求简单示例
转至:https://my.oschina.net/u/658145/blog/167651
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> Ajax </title>
<script type="text/javascript">
var xmlHttpReq = null;//XMLHttpRequest对象 // 去除字符串两边空格
String.prototype.trim = function () {
return this.replace(/(^\s*)|(\s*$)/g, "");
} // 创建XMLHttpRequest对象
function createXMLHttpRequest() {
if (window.XMLHttpRequest) {// IE 7.0及以上版本和非IE的浏览器
xmlHttpReq = new XMLHttpRequest();
} else
{
// IE 6.0及以下版本 t
ry { xmlHttpReq = new ActiveXObject("MSXML2.XMLHTTP");
}catch (e) {
try {
xmlHttpReq = new ActiveXObject("Microsoft.XMLHTTP");
}catch (e) {}
}
} if (!xmlHttpReq) {
alert("当前浏览器不支持!");
return null; }
return xmlHttpReq; } //Ajax请求
function tiplist(txt,requestMethod){
var txtValue = txt.value.trim(); if(txtValue!=""){
var parameter = "code="+txtValue+"&str=中文";
var requestURL = "http://127.0.0.1:8080/MyProj/ShowServlet";
xmlHttpReq = createXMLHttpRequest();
if("GET" == requestMethod.trim().toUpperCase()){
xmlHttpReq.open("GET",encodeURI(EncodeURI(requestURL+"?"+parameter)),true);
xmlHttpReq.setRequestHeader("If-Modified-Since","0"); xmlHttpReq.send("null");
}else if("POST" == requestMethod.trim().toUpperCase()){ xmlHttpReq.open("POST",requestURL,true);
xmlHttpReq.setRequestHeader("Content-Type","application/x-www-form-urlencoded;");
xmlHttpReq.send(encodeURI(encodeURI(parameter))); }else{ alert("错误的请求方式!");
return; } xmlHttpReq.onreadystatechange = function(){ if(xmlHttpReq.readyState == 4){
switch(xmlHttpReq.status){ case 200:
//var datas = xmlHttpReq.responseXML.getElementsByTagName("data");
//alert(datas.length); document.getElementById("downlist").innerHTML = xmlHttpReq.responseText;
break; case 400: alert("错误的请求!\nError Code:400!"); break;
case 403: alert("拒绝请求!\nError Code:403!"); break;
case 404: alert("请求地址不存在!\nError Code:404!");
break; case 500: alert("内部错误!\nError Code:500!");
break; case 503: alert("服务不可用!\nError Code:503!");
break; default: alert("请求返回异常!\nError Code:"+xmlHttpReq.status);
break; } } } } } </script> </head> <body>
<input type="text" id="txt"name="txt"value=""onkeyup="tiplist(this,'post');" /><br/><br/>
<divid="downlist"style="width:200px;height:300px;background:gray;"></div> </body> </html>
转贴:JavaScript实现Ajax请求简单示例的更多相关文章
- 原生javaScript完成Ajax请求
使用原生javaScript完成Ajax请求,首先应该创建一个对象XMLHttprequest,考虑到兼容低版本IE浏览器,使用ActiveXObject对象,代码入下: var request; i ...
- javascript版Ajax请求
什么是Ajax请求,Ajax也就是“Asynchronous JavaScript and XML”(异步JavaScript和XML),无刷新数据读取.能减少流量的消耗,也提高了浏览的流畅性,给用户 ...
- AJAX的简单示例:注册校验
众所周知,我们每次需要注册一个网站的用户名时,都会校验该邮箱.用户名是不是正确的格式.是不是有被使用过,密码是否符合规则,二次确认是否符合. 如果这些校验都采用form表单提交的话,会给用户带来极不好 ...
- JavaScript原生Ajax请求纯文本数据
源代码 ajax1.html: <!DOCTYPE html> <html> <head> <meta charset="utf-8"&g ...
- JavaScript的Ajax请求示例
//创建XMLHttpRequest对象 var request = false; try { request = new ...
- 前端javascript发送ajax请求、后台书写function小案例
HTML端页面: <td> <input class="pp_text" type="text" name="" valu ...
- javascript中Ajax的简单封装
GET方式的在线:DEMO POST方式在线:DEMO // 1.封裝AJAX函數 function nativeAjax(option,success,error){ // 定义domain,方便环 ...
- javascript原生ajax请求
class Ajax{ constructor(url, method, data, callback_suc, callback_err, callback_run){ this.RT = true ...
- JavaScript 伪Ajax请求
伪Ajax 通过iframe以及form表单,可以实现伪Ajax的方式. 并且它的兼容性是最好的. iframe iframe标签能够获取一个其他页面的文档内容,这说明它内部肯定是发送了一个请求,并且 ...
随机推荐
- Oracle中Kill session的研究(转 出自eagle)
itpub link: http://www.itpub.net/235873.html 我们知道,在Oracle数据库中,可以通过kill session的方式来终止一个进程,其基本语法结构为: a ...
- oracle 判断中文函数
create or replace function func_chinese( p_str in varchar2, -- 输入的字符串 p_code in varchar ...
- Android中AutoCompleteTextView的使用
1.http://blog.csdn.net/FX_SKY/article/details/9326129 此博客讲解了auto组件如何使用baseAdapter来扩展功能,推荐参照此博客写demo ...
- Windows下Git安装指南
参考<Git权威指南>安装整理,图书配套网址参见[1] 1. Cygwin下安装配置Git 1. 在Windows下安装配置Git有2种不同的方案 (1)msysGit, (2)Cygwi ...
- 用手机地图GPS导航费流量吗?
如果你的手机带有GPS芯片,那么使用手机导航是不会耗费手机流量的.但是如果你的手机没有GPS芯片,而使用的导航软件又是类似于移动提供的导航服务那样的导航功能,那就耗费手机流量了. 目前,导航软件导航主 ...
- url rewrite
http://www.microsoft.com/taiwan/technet/iis/expand/URLRewrite.aspx http://www.iis.net/learn/extensio ...
- 为什么要提倡“Design Pattern呢
为什么要提倡“Design Pattern呢?根本原因是为了代码复用,增加可维护性. 那么怎么才能实现代码复用呢?面向对象有几个原则:开闭原则(Open Closed Principle,OCP).里 ...
- Oracle数据库入门——高水位线详解
一.什么是水线(High Water Mark)? 所有的oracle段(segments,在此,为了理解方便,建议把segment作为表的一个同义词) 都有一个在段内容纳数据的上限,我们把这个上限称 ...
- MFC窗口和控件大小等比例变化
第一步:OnInitDialog里保存对话框及其所有子窗体的Rect区域 CRect rect; GetWindowRect(&rect); listRect.AddTail(rect);// ...
- Oracle 物化视图 说明
一. 物化视图概述 Oracle的物化视图是包括一个查询结果的数据库对像,它是远程数据的的本地副本,或者用来生成基于数据表求和的汇总表.物化视图存储基于远程表的数据,也可以称为快照. 物化视图可 ...