package jquery.getstart;
import java.util.ArrayList;
import java.util.List;
import com.opensymphony.xwork2.ActionSupport;
public class AutoCompleteAction extends ActionSupport {
/**
*
*/
private static final long serialVersionUID = 1L;
private String queryString;
public String getQueryString() {
return queryString;
}
public void setQueryString(String queryString) {
this.queryString = queryString;
}
public List<ProvinceJsonBean> getResults(){
return new ArrayList<ProvinceJsonBean>(){
{
ProvinceJsonBean jsonBean=new ProvinceJsonBean();
jsonBean.setText("北京");
Province province=new Province();
province.setId("1");
province.setName("北京");
jsonBean.setJson(province);
this.add(jsonBean);
}
};
}
public String query() {
return SUCCESS;
}
public static class ProvinceJsonBean{
private String text;
private Province json;
public String getText() {
return text;
}
public void setText(String text) {
this.text = text;
}
public Province getJson() {
return json;
}
public void setJson(Province json) {
this.json = json;
}
}
}
代码存放 http://svn.w18.net/svn/junfordemo/trunk/ssh_jquery
我的代码 实现了城市的查找
<?xml version="1.0" encoding="UTF-8" ?>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>jQuery入门</title>
<link href="css/james.css" type="text/css" rel="stylesheet"/>
<link href="css/default.css" type="text/css" rel="stylesheet"/>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.james.js"></script>
<script type="text/javascript">
var id;
$(document).ready(function() {
$("#orderedlist").addClass("red");
});
$(document).ready(function() {
$("#orderedlist > li").addClass("blue");
});
$(document).ready(function() {
$("#orderedlist li").hover(function() {
$(this).addClass("blue");
},function(){
$(this).removeClass("blue");
});
});
$(document).ready(function() {
$("#orderedlist li:last").hover(function() {
$(this).addClass("blue");
},function(){
$(this).removeClass("blue");
});
});
$(document).ready(function() {
$('#faq').find('dd').hide().end().find('dt').click(function() {
$(this).next().slideToggle();
});
});
$(document).ready(function() {
$("#province").james("autocomplete.action",
{method:"post",minlength:1,varname:"queryString",
onSelect:function(data,json){
id=json.id;
return json.name;
}
});
});
$(document).ready(function() {
$("#savesss").click(function() {
document.location.href="save.action?id="+id
});
});
</script>
</head>
<body>
<h1>第一个程序</h1>
<a href="">Link</a>
<hr />
<ol id="orderedlist">
<li>fsdg</li>
<li>sdfg</li>
<li>王朝</li>
</ol>
<hr />
<h1>相邻元素的选择</h1>
<h2>FAQ</h2>
<dl id="faq">
<dt>为什么使用jQuery？</dt>
<dd>jQuery可以用最少的javascript代码实现最多的功能，而且性能很好。</dd>
<dt>和jQuery类似的api还有哪些？</dt>
<dd>比如prototype、mootools、YUI、dojo和extjs等。</dd>
</dl>
<hr />
<label for="province">你来自哪个省/直辖市：</label><input id="province" type="text" />
<input id="savesss" type="button" />
</body>
</html>
action的配置
<struts>
<constant name="struts.objectFactory"
value="org.apache.struts2.spring.StrutsSpringObjectFactory" />
<package name="/city" extends="json-default">
<action name="autocomplete" class="autocompleteAction" method="query">
<result type="json">
<param name="root">results</param>
</result>
</action>
</package>
</struts>
实体类
分享到：
相关推荐
本Ajax小例子源码提供了对这一技术的基础应用，非常适合初学者学习和理解Ajax的工作原理。下面我们将详细解析Ajax的几个关键知识点： 1. **XMLHttpRequest对象**：这是Ajax的核心，它是JavaScript内置的对象，用于...
ASP.NET与jQuery AJAX的结合是Web开发中常见的一种技术组合，它使得页面的异步更新成为可能，提高用户体验。在本教程中，我们将探讨如何在ASP.NET中...这个小例子提供了一个起点，你可以根据项目需求进一步扩展和优化。
【上传文件的AJAX小例子】是一个通过HTML5新特性实现的文件上传示例，它结合了AJAX技术，提供了一种无需刷新页面即可完成文件上传的交互方式。在这个例子中，IBM展示了一种创新的文件上传解决方案，尤其是利用了...
利用控件来时间动态刷新，控件调用ajax的函数。再将空间放到任何页面就可以时间动态刷新了，很方便。注意一点的是，要在页面的onload中增加调用控件中的javascript函数的内容，具体的看代码就知道了。
**Java EE AJAX小例子详解** 在Java EE开发中，AJAX（Asynchronous JavaScript and XML）是一种用于创建交互式Web应用程序的技术，它允许页面在不重新加载整个页面的情况下与服务器进行异步通信。在这个"JAVA EE ...
这个"ajax小例子"很可能是为了演示如何使用Ajax技术来实现动态页面交互。在这个小例子中，我们可以推测作者可能创建了一个简单的应用，该应用利用Ajax进行实时时间更新，文件名为"ajaxtime"。 在Ajax中，主要涉及...
dwr实现Ajax小例子 例子中已包含dwr.jar DWR(Direct Web Remoting)是一个WEB远程调用框架.利用这个框架可以让AJAX开发变得很简单.利用DWR可以在客户端利用JavaScript直接调用服务端的Java方法并返回值给JavaScript就...
这个"ajax小例子"旨在为初学者提供一个学习和理解Ajax基本用法的平台。通过分析这个项目，我们可以深入理解Ajax的核心概念以及如何在实际应用中使用它。 首先，我们关注的是`.classpath`和`.project`文件。这两个...
本压缩包中的"包含两种 AJAX 小例子"提供了两种不同的AJAX实现方式，帮助开发者更深入地理解和运用这一技术。 首先，我们来看第一种AJAX实现方式。通常情况下，JavaScript通过XMLHttpRequest对象来实现AJAX通信。在...
在探讨“ajax小例子 鼠标移动菜单 显示详细信息”这一主题时，我们首先需要理解AJAX（Asynchronous JavaScript and XML）的基本概念及其在Web开发中的应用。AJAX是一种用于创建快速动态网页的技术，它允许网页在不...
jquery实现ajax小例子（资源分高了点，但绝对物超所值） 使用jquery实现XML与JSON同服务器的通信 提供了很多个常见的Ajax特效，学习这几个特效能助您学习jquery 项目中已有相关的包及工具，导入MyEclipse后可直接...
这些例子可能包括了级联选择和自动补全等交互效果，你可以直接运行这些示例，观察它们的工作原理。 总结，jQuery和Ajax的结合大大提高了Web应用的用户体验，使得网页能够在不刷新的情况下与服务器进行通信。通过...
这个小例子涵盖了Web开发中的基本交互流程，对于初学者来说是一个很好的实践项目，可以帮助理解JDBC、Servlet和Ajax之间的协同工作方式。同时，它也展示了如何通过这些技术提高用户体验，使用户可以在不刷新页面的...
讲解了Ajax的应用，Ajax的几种技术的集合，如：JavaScript 、css 、xml 、xmlHttpRequest等
学习这个小例子，你可以了解到如何在C# ASP.NET环境中设置AJAX环境，如何使用UpdatePanel实现无刷新更新，以及如何通过Web服务或PageMethods处理异步请求。同时，也会理解到JavaScript和jQuery如何与服务器端代码...