AJAX根据城市名，自动完成相应的城市信息
更新时间：2007年01月28日 00:00:00 作者：
以前在做项目的时候碰到这样的需求。用户希望能够直接输入城市的名字，就能够得到这个城市的相应的信息。以前是在页面打开的时候生成几个JavaScript数组，然后来对比的。这样做的话，如果数据比较多的时候，用户会明显的感到响应延迟。
现在该成用ajax的方法来做，速度要快一些，客户体验会好一些。谁要咱们处在“体验经济”时代呢！
下面是做的一个小例子，由两个页面组成。
city.html页代码如下：
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
zipcode.jsp代码如下：
<%@ page contentType="text/html;charset=gb2312" %>
<%@ page import="java.util.*" %>
<%@ page import="java.sql.Connection"%>
<%@ page import="java.sql.PreparedStatement"%>
<%@ page import="java.sql.ResultSet"%>
<%@ page import="com.util.MyConnection"%>
<%
String city = request.getParameter("city");
if(city==null)
{
city= "";
}
if(!city.equals(""))
{
String sql="select citrmm,cittier from tb_basecity where citname like '"+city+"'";
Connection conn = MyConnection.getConnection();
PreparedStatement state= conn.prepareStatement(sql);
ResultSet rs = state.executeQuery();
if(rs.next())
{
out.println(rs.getString("citrmm")+"|"+rs.getString("cittier"));
}
else
{
out.println("未知"+"|"+"未知");
}
rs.close();
state.close();
conn.close();
}
else
{
out.println("未知"+"|"+"未知");
}
%>
PS：
Http.send()后，经检测Http.readystate==4，说明载入完毕，这时网页内容已经载入 到了Http.responseBody中了
现在该成用ajax的方法来做，速度要快一些，客户体验会好一些。谁要咱们处在“体验经济”时代呢！
下面是做的一个小例子，由两个页面组成。
city.html页代码如下：
[Ctrl+A 全选 注:引入外部Js需再刷新一下页面才能执行]
zipcode.jsp代码如下：
复制代码 代码如下:
<%@ page contentType="text/html;charset=gb2312" %>
<%@ page import="java.util.*" %>
<%@ page import="java.sql.Connection"%>
<%@ page import="java.sql.PreparedStatement"%>
<%@ page import="java.sql.ResultSet"%>
<%@ page import="com.util.MyConnection"%>
<%
String city = request.getParameter("city");
if(city==null)
{
city= "";
}
if(!city.equals(""))
{
String sql="select citrmm,cittier from tb_basecity where citname like '"+city+"'";
Connection conn = MyConnection.getConnection();
PreparedStatement state= conn.prepareStatement(sql);
ResultSet rs = state.executeQuery();
if(rs.next())
{
out.println(rs.getString("citrmm")+"|"+rs.getString("cittier"));
}
else
{
out.println("未知"+"|"+"未知");
}
rs.close();
state.close();
conn.close();
}
else
{
out.println("未知"+"|"+"未知");
}
%>
PS：
Http.send()后，经检测Http.readystate==4，说明载入完毕，这时网页内容已经载入 到了Http.responseBody中了
相关文章
用juery的ajax方法调用aspx.cs页面中的webmethod方法示例
juery的ajax调用aspx.cs页面中的webmethod方法：首先在 aspx.cs文件里建一个公开的静态方法，然后加上WebMethod属性，具体实现如下，感兴趣的朋友可以参考下哈，希望对大家有所帮助2013-07-07
ajax 发送请求时状态判断 if else 语句问题如何解决呢？接下来通过本文给大家分享ajax犯的错误处理方法，对ajax错误感兴趣的朋友一起看看吧2016-09-09
这篇文章主要介绍了基于h5的history改善ajax列表请求体验的相关资料,需要的朋友可以参考下2015-11-11
最近项目有这样一个需求，点击六大洲，出现对应的一些请求信息，展示在下面，当请求之后，第二次点击就不用再次请求了，究竟用代码怎么写呢，下面小编带领大家了解了解2015-09-09
通过ajax向后台发送和接收数据时，常常会出现同步异步问题。这篇文章给大家介绍Ajax同步和异步问题浅析，需要的朋友参考下2017-02-02
本文主要介绍了ajax实现登录功能的示例代码。具有很好的参考价值。下面跟着小编一起来看下吧2017-03-03
下面是ajax实现一个简单的百度搜索栏的功能，当用户在上面的输入框中键入字符时，会执行函数 "showHint()" 。下文通过实例代码给大家介绍的非常详细，感兴趣的朋友一起看看吧2016-11-11
本文由脚本之家小编跟大家分享的ajax请求Session失效问题，感兴趣的朋友一起看看吧2015-09-09
今天小编就为大家分享一篇layui的checbox在Ajax局部刷新下的设置方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-08-08
AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下,通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新,下面这篇文章主要给大家介绍了关于原生Ajax之全面了解xhr的概念与使用的相关资料,需要的朋友可以参考下2022-11-11
最新评论