Struts:第一个小程序

崎岖的诞生过程

说明一下，这并非是说代码难敲什么的。从昨晚敲完书本上的代码后，一直就不能正常的测试！！！觉得有点迷茫，甚至有点灰心。。。可是，可是，转念一想，这不是长姿势的好机会么？于是，慢慢找答案吧。

OK!回到正题,简单说说我遇到的几个错误,以及解决方案.

小应用简述

这是一个登陆验证的特别简单的例子,共有以下几个配置文件:

登陆页:index.jsp
欢迎页:welcome.jsp
Action:LoginAction

这个例子就是从登陆页输入用户名和密码,然后发送至Action处理，如果用户名和密码正确，则跳转到weclome.jsp页面,否则留在index.jsp页面.

struts2 action class not found

这是我使用的搜索词,大致意思是:当表单提交的时候,访问不了Action…这可苦逼了,第一次配置Struts就遇到这事,心中难免失落……不过也不能不做啊!于是找各种答案,各种尝试,反正就是访问不了.

其实解决方案并不是很难,在提交表单的时候写成下面这个样子就行了:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

<?xml version="1.0" encoding="UTF-8" ?>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<!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>Insert title here</title>
</head>
<body>
<s:form action="action_struts/loginA.action" method="post">
<s:label value="登录信息"></s:label>
<s:textfield name="username" label="用户名"></s:textfield>
<s:password name="userpass" label="密码"></s:password>
<s:submit value="登录"></s:submit>
</s:form>
</body>
</html>

Struts2 抛 java.lang.NoSuchMethodException

这个方法指的是找不到指定的方法,所以抛出这个异常。

抛出这个异常的原因是,下面这段代码写成这样了:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.1//EN"
"http://struts.apache.org/dtds/struts-2.1.dtd">
<struts>
<constant name="struts.enable.DynamicMethodInvocation" value="true" />

<package name="first" extends="struts-default" namespace="/N12">

<action name="loginA" class="action_struts.LoginAction" method="{1}" >
<result name="success">/welcome.jsp</result>
<result name="login">/index.jsp</result>
</action>
</package>

</struts>

重复的action

这个问题我还没有找到解决办法,具体错误如下:每成功的登录一次,URL中就会重复一次[Action类所在包的包名,例如包名是:actions],那么每登录成功一次,包名就会多一个.
形如:

1	localhost:8080/TEST/A10/actions/[actions...+]/LoginAction.action

完整的代码

测试可用.
系统环境如下:

tomcat 7.0.35
Eclipse 4.2
struts 2
jdk 1.7

index.jsp[首页][所在文件夹:WebContent]:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

<?xml version="1.0" encoding="UTF-8" ?>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<!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>Insert title here</title>
</head>
<body>

<s:form action="action_struts/loginA.action" method="post">
<s:label value="登录信息"></s:label>
<s:textfield name="username" label="用户名"></s:textfield>
<s:password name="userpass" label="密码"></s:password>
<s:submit value="登录"></s:submit>
</s:form>
</body>
</html>

welcome.jsp[欢迎页][所在文件夹:WebContent]:

1
2
3
4
5
6
7
8
9
10
11
12
13
14

<?xml version="1.0" encoding="UTF-8" ?>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<!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>Insert title here</title>
</head>
<body>
登录成功,欢迎您,<s:property value="username" />
</body>
</html>

struts.xml[struts核心配置文件][所在文件夹:WebContent/WEB-INF/classes/]:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.1//EN"
"http://struts.apache.org/dtds/struts-2.1.dtd">
<struts>
<constant name="struts.enable.DynamicMethodInvocation" value="true" />

<package name="first" extends="struts-default" namespace="/">

<action name="loginA" class="action_struts.LoginAction" >
<result name="success">/welcome.jsp</result>
<result name="login">/index.jsp</result>
</action>
</package>

</struts>

web.xm[所在文件夹:WebContent/WEB-INF/]l:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"
id="WebApp_ID" version="3.0">
<display-name>SSH</display-name>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>

<filter>
<filter-name>struts2</filter-name>
<filter-class>org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter</filter-class>
</filter>

<filter-mapping>
<filter-name>struts2</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
</web-app>

Action:LoginAction.java[Java Resources:src>[package:action_struts]]:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

package action_struts;

import com.opensymphony.xwork2.ActionSupport;

public class LoginAction extends ActionSupport {

private String username ;//用户名
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
public String getUserpass() {
return userpass;
}
public void setUserpass(String userpass) {
this.userpass = userpass;
}
private String userpass ;//密码.

public String execute(){//主方法
if("mr".equalsIgnoreCase(username)&& "123".equals(userpass)){//匹配用户名和密码
return SUCCESS;//匹配成功进入欢迎界面.
}
return LOGIN;//匹配失败进入登录界面
}

}

struts的jar包请放在WebContent/WEB-INF/lib/文件夹内,我是导入了所有jar包.
一切弄好之后:打开浏览器,输入[localhost:8080/[项目名]/index.jsp],就能测试了[用户名:mr,密码:123].

继续前行,COM ON!~

[视频教程]教你如何导出微信里的语音

如何导出微信中的语音片段

是否还在为微信中女神发来的语音不能保存而苦恼？是否还在为微信中美女发来的清唱不能保存而伤神？

现在不用了…下面来看如何导出微信中保存的语音

将手机连接到电脑

目前我的手机已经连接到电脑了，下面我们来查找文件夹.

在这个目录中:[J]:\Tencent\MicroMsg\fd5b768e587a4450ec0621070ea2d09b[这段很长的字符是随机的,你的可能与我的不一样,另外{J}是我电脑分配的盘符,你的也可能不一样]的voice,voice2中都是保存着微信中接收到以及发送出去的语音信息,注意:微信是以.amr格式保存的语音信息,如果要转换成别的格式,请自行搜索.

查找文件

因为里面文件夹特别多，因此我们需要一个一个去找，这样未免太麻烦了。这时候我们可以使用搜索去找到所有.amr的文件.

使用[*.amr]搜索所有.amr的文件,[*]是通配符.

一共221个文件,这么多文件，如何去找里面哪个才是我们所需要的呢？因为是.amr的文件，所以大部分电影播放器都是可以放的[我用的是暴风影音].下面我们试试

找到你所需要的

下面将搜索到的文件全都添加到暴风影音的列表,如果暴风没有安装.amr的解码器,它会自动下载.

这时候会选了吧？还不会???

其实很简单，按照时间来选择就好了

比如:这个50秒的已经开始播放了.确认是自己需要的之后，按照下面这样做会了吧？复制文件之后就可以粘贴到你所需要的地方了.噢耶!

小伙伴们，和我都惊呆了.请勿在意此编辑器..

视频教程

可以使用[格式工厂]去进行格式转换.

单击此链接去新窗口看.[/wp-content/uploads/2013/08/SaveWeixinVideo.swf]

jQuery中的Ajax

关于

jQuery对Ajax操作进行了封装，在jQuery中$.ajax()方法属于最底层的方法，第二层是$.load(),$.get(),和$.post()方法，第三层是$.getScript()和$.getJSON()方法。首先介绍第二层的方法，因为其使用频率很高.

load()方法

　　1.载入HTML文档
　　

　load()方法是jQuery中最为简单和常用的Ajax方法，能载入远程HTML代码并插入DOM中。它的结构为:

1 2	load(url [,data] [,callback])

load()方法参数解释如下

load()方法参数解释
参数名称	类型	说明
url	String	请求HTML页面的URL地址
data(可选)	Object	发送至服务器的key/value数据
callback(可选)	Function	请求完成时的回调函数

2.筛选载入的HTML文档

　　load()方法的URL参数的语法结构为:”url selector”.注意，URL和选择器之间有一个空格.
例如,只需要加载test.html页面中class为para的内容,可以使用下面的代码来完成:

1	$("resText").load("test.html .para");

3.传递方式

　　load()方法的传递方式根据参数data来自动指定，如果没有传递参数，则采用GET方式传递；反之，则会自动转换为POST方式。

//无参数传递,则是GET方式.

$(“#resText”).load(“test.php”,function(){
//…
});

//有参数传递,则是POST方式

$(“#resText”).load(“test.php”,{name:”rain”,age:”22″},function(){
//…
});

4.回调参数
　

　对于必须在加载完成后才能将继续的操作，load()方法提供了回调函数(callback),该函数有3个参数,分别代表请求返回的内容，请求状态和XMLHttpRequest对象，jQuery代码如下:

1
2
3
4
5

$("#resText").load("test.html",function(responseText,textStatus,XMLHttpRequest){
//responseText: 请求返回的内容
//textStatus:请求状态:success,error,notmodified,timeout
//XMLHttpRequest:XMLHttpRequest对象
});

注意:在load()方法中，无论Ajax请求是否成功，只要当请求完成(complete)后,回调函数(callback)就被触发.对应下面将介绍的$.ajax()方法中的complete回调函数

$.get()方法和$.post()方法

load()方法通常用来从WEB服务器上获取静态的数据文件，然而这并不能体现Ajax的全部价值.在项目中，如果需要传递一些参数给服务器中的页面，那么可以使用$.get()或者$.post()方法(或者是后面要讲解的$.ajax(）方法).

注意:$.get()和$.post()方法是jQuery中的全局函数,而在此之前讲的jQuery方法都是对jQuery对象进行操作的. 1.$.get()方法

$.get()方法使用GET方式来进行异步请求。
它的结构为:

1	$.get(url [,data] [, callback] [,type])

示例

1	$("#feeds").load("feeds.html");//加载feeds.html的内容

$.get()方法参数解释如下:

$.get()方法参数解释
参数名称	类型	说明
url	String	请求的HTML页的URL地址
data(可选)	Object	发送至服务器的key/value数据会作为QueryString附加到请求的URL中
callback(可选)	Function	载入成功时回调函数(只有当Response的返回状态是success才调用该方法)自动将请求结果和状态传递给该方法
type(可选)	String	服务器端返回内容的格式,包括xml,html,script,json,text和_default

示例

1
2
3

$.get("test.php", function(data){
alert("Data Loaded: " + data);
});

2.$.post()方法

它与$.get()方法的结构和使用方式相同，不过它们之间仍然有以下区别:

GET请求会将参数跟在URL后进行传递，而POST请求则是作为HTTP消息的实体内容发送给WEB服务器。当然，在Ajax请求中，这种区别对用户是不可见的。
GET方式对传输的数据有大小限制（通常不能大于2KB），而使用POST方式传递的数据量要比GET方式大得多（理论上不受限制）。
GET方式请求的数据会被浏览器缓存起来，因此其他人就可以从浏览器的历史记录中读取到这些数据，例如账号和密码等。在某种情况下，GET方式会带来严重的安全性问题，而POST方式相对来说就可以避免这些问题。
GET方式和POST方式传递的数据在服务器端的获取也不相同，在PHP中，GET方式的数据可以用$_GET[]获取,而POST方式可以用$_POST[]获取。两种方式都可以用$_REQUEST[]来获取.

由于POST和GET方式提交的所有数据都可以通过$_REQUEST[]来获取，因此只需要改变jQuery函数就可以将程序在GET请求和POST请求之间切换。代码如下：

1
2
3
4
5
6
7
8
9
10

　　$(function(){
　　 $("#send").click(function(){
　　 $.post("post1.php",{
　　 username : $("#username").val(),
　　 content : $("#content").val()
　　 },function (data,textStatus){
　　 $("#resText").appent(data); //将返回的数据添加到页面上
　　 });
　　 });
　　})

另外，当load()方法带有参数传递时，会使用POST方式发送请求。因此也可以使用load()方法来完成同样的功能.代码如下:

1
2
3
4
5
6
7
8

　　$(function(){
　　 $("#send").click(function(){
　　 $("#resText").load("post1.php",{
　　 username : $("#username").val(),
　　 content : $("#content").val()
　　 })
　　 })
　　})

上面使用load(),$.get()和$.post()方法完成了一些常规的Ajax程序,如果还需要编写一些复杂的Ajax程序，那么就要用到jQuery中的$.ajax方法.$.ajax()方法不仅能实现与load(),$.get()和$.post()方法同样的功能,而且还可以设定beforeSend(提交前回调函数),error(请求失败后处理),success(请求成功后处理)以及complete(请求完成后处理)回调函数,通过这些回调函数,可以给用户更多的Ajax提示信息.另外，还有一些参数,可以设置的超时时间或者页面的“最后更改”状态等等。

$.getScript()方法和$.getJson()方法

1.$.getScript()

有时候,在页面初次加载时就取得所需的全部JavaScript文件是完全没有必要的。虽然可以在需要哪个JavaScript文件时,动态地创建<scrip>标签,jQuery代码如下:

1
2
3

　　$(document.createElement(“script”)).attr(“src”,”test.js”).appendTo(“head”);
　　//或者
　　$(“<script type=’text/javascript’ src=’test.js’ />”).appendTo(“head”);

　　但这种方式并不理想。为此，jQuery提供了$.getScript()方法来直接加载.js文件,与加载一个HTML片段一样简单方便，并且不需要对JavaScript文件进行处理，JavaScript文件会自动执行.jQuery代码如下:

1
2
3
4
5

　　$(function(){
　　$(‘#send’).click(function(){
　　$.getScript(‘test.js’);
　　});
　　})

与其他Ajax方法一样，$.getScript()方法也有回调函数,它会在JavaScript文件成功载入后运行。例如想载入jQuery官方颜色动画插件(jquery.color.js).成功后给元素绑定颜色变化动画,就可以用到$.getScript()方法的回调函数.代码如下:

1
2
3
4
5
6
7
8
9

　　$(function(){
　　 $.getScript
　　 ('http://dev.jquery.com/view/trunk/plugins/color/jquery.color.js',function(){
　　 $("#go").click(function() {
　　 $(".block").animate({backgroundColor:'pink'},1000)
　　 .animate({backgroundColor:'blue'},1000);
　　 })
　　 })
　　 })

当jquery.color.js动画插件加载完毕后,单击id为”go”的按钮时,class为block的元素就有了颜色变化.

2.$.getJSON()

$.getJSON()方法用于加载JSON文件,与$.getScript()方法的用法相同.jQuery代码如下:

1
2
3
4
5

　　$(function(){
　　 $("#send").click(function() {
　　 $.getJSON('test.json');
　　 });
　　 })

当单击”加载”按钮后，网页上卡不到任何效果，虽然函数加载了JSON文件，但是并没有告诉JavaScript对返回的数据如何处理。为此，jQuery提供了回调函数，在回调函数里处理返回的数据。代码如下：

1
2
3
4
5
6
7

　　$(function(){
　　 $("#send").click(function() {
　　 $.getJSON('test.json',function(data){
　　 //data:返回的数据
　　 });
　　 });
　　 })

可以在函数中通过data变量来遍历相应的数据。$.each()函数不同于jQuery对象的each()方法,它是一个全局函数，不操作jQuery对象，而是以一个数组或者对象作为第一个参数，以一个回调函数作为第二个参数。回调函数拥有两个参数，第一个为对象的成员或数组的索引，第二个为对应的变量或内容.代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14

　　$(function(){
　　 $("#send").click(function() {
　　 $.getJSON('test.json',function(data){
　　 $('#resText').empty();
　　 var html = '' ;
　　 $.each(data,function(commentIndex,comment){
　　 html += '<div class="comment"><h6>'
　　 + comment['username']+':</h6><p class="para">'
　　 + comment['content'] + '</p></div>' ;
　　 });
　　 $('#resText').html(html);
　　 });
　　 });
　　 })

　　在上面的代码中，当返回数据成功后，首先清空id为”resText”的元素的内容,以便重新构造新的HTML，然后通过$.each()循环函数依次遍历每个项,并将遍历出来的内容构建成HTML代码拼接起来,最后将构建好的HTML添加到id为”resText”的元素中.
不仅如此,还能通过使用JSONP姓氏的回调函数来加载其他网站的JSON数据，例如从图片网站(Flickr)搜索汽车类别的4张最新图片.代码如下:

1
2
3
4
5
6
7
8
9
10
11
12

　　$(function(){
　　 $("#send").click(function() {
　　 $.getJSON('http://api.flickr.com/services/feeds/photos_public.gne?tags=car&tagmode=any&format=json&jsoncallback=?',function(data){
　　 $.each(data.items,function(i,item){
　　 $("<img class='para'/>").attr("src",item.media.m).appendTo("#resText");
　　 if (i==3){
　　 return false;
　　 }
　　 });
　　 });
　　 });
　　 })

在$.each()函数中，如果需要退出each循环，只要返回false即可.

注意:

jQuery将自动把URL里的回调函数，例如”url?callback=?”中的后一个”?”替换为正确的函数名,以便执行互调函数.
　　JSONP(JSON with Padding)是一个非官方的协议,它允许在服务器端集成Scripttags返回至客户端,通过JavaScript Callback的姓氏实现跨域访问。由于JSON只是一种含有简单括号结构的纯文本，因此许多通道都可以交换JSON消息，而由于同源策略的限制，开发人员不能在与外部服务器进行通信的时候使用XMLHttpRequest.而JSONP是一种可以绕过同源策略的方法，即通过使用JSON与<scrip>>标记相结合的方法，从服务器端直接返回可执行的JavaScript函数调用或者JavaScript对象。目前JSONP已经成为各大公司的Web应用程序跨域首选,例如Youtube GData,Goole Social Graph,Digg,豆瓣等.

$.ajax()方法

$.ajax()方法是jQuery最底层的Ajax实现.它的结构为:

1	$.ajax(options)

该方法只有1个参数,但在这个对象里包含了$.ajax()方法所需要的请求设置以及回调函数等信息，参数以key/value的形式存在,所有参数都是可选的，常用参数如下:

$.ajax()方法常用参数解释

参数名称

类型

说明

url

String

(默认为当前页地址)发送请求的地址

type

String

请求方式(POST或GET)默认为GET。注意其他HTTP请求方法,例如PUT和DELETE也可以使用，但仅部分浏览器支持

timeout

Number

设置请求超时时间(毫秒).此设置将覆盖$.ajaxSetup()方法的全局设置

data

Object或String

发送到服务器的数据。如果已经不是字符串，将自动转换为字符串格式。GET请求中将附加在URL后。防止这种自动转换,可以查看processData选项。对象必须为key/value格式，例如:{foo1 : “bar1”, foo2: “bar2”}转换为&foo1=bar1&foo2=bar2.如果是数组,jQuery将自动为不同值对应同一个名称.例如:{foo:[“bar1″,”bar2”]}转换为&foo=bar1&foo=bar2

dataType

String

预期服务器返回的数据类型。如果不指定，jQuery将自动根据HTTP包MIME信息返回responseXML或responseText,并作为回调函数参数传递.
可用的类型如下:
xml:返回XML文档，可用jQuery处理.
html:返回纯文本HTML信息,包含的script标签会在插入DOM时执行.
script:返回纯文本JavaScript代码.不会自动缓存结果.除非设置了cache参数.注意在远程请求时(不在同一个域下),所有POST请求都将转为GET请求.
json:返回JSON数据.
jsonp:JSONP格式。使用SONP形式调用函数时，例如:myurl?callback=?,jQuery将自动替换后一个”?”为正确的函数名，以执行回调函数.
text:返回纯文本字符串

beforeSend

Function

发送请求前可以修改XMLHttpRequest对象的函数,例如添加自定义HTTP头。在beforeSend中如果返回false可以取消本次Ajax请求.XMLHttpRequest对象是唯一的参数.

1
2
3

function(XMLHttpRequest){
this;//调用本次Ajax请求时传递的options参数
}

complete

Function

请求完成后调用的回调函数（请求成功或失败时均调用）．参数：XMLHttpRequest对象和一个描述成功请求类型的字符串.

1
2
3

function(XMLHttpRequest,textStatus){
this;//调用本次Ajax请求时传递的options参数
}

success

Function

请求成功后调用的回调函数,有两个参数.

由服务器返回，并根据dataType参数进行处理后的数据.
描述状态的字符串

1
2
3
4

function(data,textStatus){
//data可能是xmlDoc,jsonObj,html,text等等
this;//调用本次Ajax请求时传递的options参数
}

error

Function

请求失败时被调用的函数.该函数有3个参数,即XMLHttpRequest对象,错误信息,捕获的错误对象(可选).Ajax事件函数如下.

1
2
3
4

function(XMLHttpRequest,textStatus,errorThrown){
//通常情况下textStatus和errorThown只有其中一个包含信息
this;//调用本次Ajax请求时传递的options参数
}

global

Boolean

默认为true.表示是否触发全局Ajax事件.设置为false将不会触发全局Ajax事件,AjaxStart或AjaxStop可用于控制各种Ajax事件.

如果需要使用$.ajax()方法来进行ajax开发,那么上面这些常用的参数都必须了解。此外，$.ajax方法还有其他参数.前面用到的$.load(),$.get(),$.post(),$.getScript()和$.getJSON()这些方法，都是基于$.ajax()方法构建的,$.ajax()方法是jQuery最底层的Ajax实现,因此可以用它来代替前面的所有方法.
例如，可以使用下面的jQuery代码代替$.getScript()方法:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31

　　$(function(){
　　 $("#send").click(function() {
　　 $.ajax({
　　 type:"GET",
　　 url:"test.js",
　　 dataType:"script"
　　 });
　　 });
　　 })
　　//再例如，可以使用以下jQuery代码来代替$.getJSON()方法:
　　$(function(){
　　 $("#send").click(function() {
　　 $.ajax({
　　 type:"GET",
　　 url:"test.json",
　　 dataType:"json",
　　 success: function(data){
　　 $("#resText").empty();
　　 var html = "";
　　 $.each(data,function(commentIndex,comment){
　　 html += '<div class="comment"><h6>'
　　 + comment['username']+':</h6><p class="para">'
　　 + comment['content'] + '</p></div>';
　　
　　 });
　　 $('#resText').html(html);
　　 }
　　 });
　　 });
　　 })
　　

序列化元素

1.serialize()方法

做项目的过程中，表单是必不可少的，经常用来提供数据，例如注册，登陆等。常规的方法是使表单提交到另一个页面，整个浏览器都会被刷新，而使用Ajax技术则能够异步的提交表单,并将服务器返回的数据显示在当前页面中.
前面在讲解$.get()和$.post()方法的时候，表单的HTML代码如下;

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

　　<form id="form1" action="#">
　　评论:
　　姓名:<input type="text" name="username" id="username" />
　　内容:<textarea name="content" id="content" rows="2" cols="20"></textarea>
　　 <input type="button" id="send" value="提交"/>
　　</form>
　　为了获取姓名和内容，必须将字段的值逐个添加到data参数中。代码如下:
　　$(function(){
　　 $("#send").click(function() {
　　 $.get("get1.php",{
　　 username : $("#username").val(),
　　 content : $("#content").val()
　　 },function(data , textStatus){
　　 $("#resText").html(data);
　　 });
　　 });
　　 })

　　这种方式在只有少量字段的表单中，勉强还可以使用，但如果表单元素越来越复杂，使用这种方式在增大工作量的同时也使表单缺乏弹性。jQuery为这一常用的操作提供了一个简化的方法————serialize()。与jQuery中其他方法一样,serialize()方法也是作用于一个jQuery对象，它能够将DOM元素内容序列化为字符串，用于Ajax请求。通过使用serialize()方法可以把刚才的jQuery代码改为如下:

1
2
3
4
5
6
7

　　$(function(){
　　 $("#send").click(function() {
　　 $.get("get1.php",$("#form1").serialize(),function(data , textStatus){
　　 $("#resText").html(data);
　　 });
　　 });
})

当单击”提交”按钮后，也能达到同样的效果.
即使在表单中再增加字段，脚本仍然能够使用，并且不需要做其他多余工作。
需要注意的是,$.get()方法中data参数不仅可以使用映射方式,如以下jQuery代码:

1
2
3
4
5
6
7

　　{
　　 username : $("#username").val(),
　　 content : $("#content").val()
　　 }
　//也可以使用字符串方式，如以下jQuery代码：
　　"username="+encodeURIComponent($('#username').val())+
　　 "&content="+encodeURIComponent($('#content').val())

用字符串方式时,需要注意对字符编码(中文问题),如果不希望编码带来麻烦，可以使用serialize()方法，它会自动编码.

因为serialize()方法作用于jQuery对象,所以不光只有表单能使用它,其他选择器选取的元素也都能使用它,如以下jQuery代码:

1	$(“:checkbox,:radio”).serialize();

把复选框和单选框的值序列化为字符串形式,只会将选中的值序列化.

2.serializeArray()方法

在jQuery中还有一个与serialize()类似的方法serializeArray(),该方法不是返回字符串，而是将DOM元素序列化后，返回JSON格式的数据。jQuery代码如下:

1 2	var fields = $(“:checkbox,:radio”).serializeArray(); console.log(fields); //用Firebug输出

既然是一个对象，那么就可以使用$.each()函数对数据进行迭代输出。代码如下:

1
2
3
4
5
6
7

　　$(function(){
　　 var fields = $(":checkbox,:radio").serializeArray();
　　 console.log(fields); //用Firebug输出
　　 $.each(fields,function(i,field){
　　 $("#results").append(field.value+",");
　　 })；
　　 })

3.$.param()方法

它是serialize()方法的核心，用来对一个数组或对象按照key/value进行序列化.
比如将一个普通的对象序列化:

1
2
3

　　var obj = {a:1,b:2,c:3};
　　var k = $.param(obj);
alert(k);//输出a=1&b=2&c=3

jQuery中的Ajax全局事件

当Ajax请求开始时,会出发ajaxStart()方法的回调；当Ajax请求结束时，会触发ajaxStop()方法的回调函数。这些方法都是全局的方法，因此无论创建它们的代码位于何处，只要有Ajax请求发生时,就会触发它们.

jQuery的Ajax全局时间中还有几个方法，也可以在使用Ajax方法的过程中为其带来方便。

另外几个方法

方法名称

说明

ajaxComplete(callback)

Ajax请求完成时执行的函数

ajaxError(callback)

Ajax请求发生错误时执行的函数,捕捉到的错误可以作为最后一个参数传递

ajaxSend(callback)

Ajax请求发送前执行的函数

ajaxSuccess(callback)

Ajax请求成功时执行的函数

注意如果想使某个Ajax请求不受全局方法的影响,那么可以在使用$.ajax(options)方法时,将参数中的global设置为false,jQuery代码如下:

1
2
3
4

$.ajax({
url: "test.html",
global: false //不触发Ajax全局事件
})

jQuery速查表

单击查看大图或者右键下载图片:

再见!5D6D

最后一次呐喊

逛论坛看到5D6D即将在8.15彻底关闭,觉得心痛,用了好几年5D6D的服务.
这是最后一次更新关于5D6D的文章了.

来自5D6D官方公告

敬爱的领主们：

请容许我最后一次这样称呼您，请认真的看完这最后一篇公告。

5d6d官方已经停访，实为下属论坛发布严重政治敏感信息。这几个月来公司领导多次与上级网安沟通，但最终被“责令关闭”。

5d6d正式关闭，但请不要过分担心，5d6d作为领主们的依托和强力后盾，我们愿意为了您发挥最后一份余热！

在有关部门未另行通知的情况下，5d6d下属论坛（二级域名）延续访问至8月15日，同时我们为您提供以下三种方案：

1DZ动力作为Discuz！专业主机，保证为5d6d领主提供稳定主机服务的同时，还提供一站式数据导入、论坛升级及专业客服技术支持。了解详情请移步：http://www.verydz.com/help/thread-126-1-1.html
25d6d无偿为领主提供论坛全部数据（数据库及附件），以供领主独立导出。下载数据请移步：http://backup.5d6d.net/bbscp.php?action=superbbs&operation=databasebak
- *因5d6d Uchome整合在窝窝中，导出的数据不包括窝窝数据。请您导入数据到独立论坛时严格参照以下教程执行：http://backup.5d6d.net/thread-621602-1-4.html
- *一旦提交数据导出申请，即刻起对应领主论坛将停止访问并提示“该论坛正在进行数据迁移”。
- *进行数据导出后，将不能使用转出到haotui.com功能！
- *数据转出和迁移到haotui.com，只能二选一！考虑清楚后，再动手，否则后果自负！
3我们为领主们提供数据转入haotui.com 。转入后您的域名将由 yourname.5d6d.net 变为 yourname.haotui.com。转入登记请移步：http://backup.5d6d.net/bbscp.php?action=superbbs&operation=haotuiapply
好推网秉着和广大领主合作共赢的态度，提供技术，带宽，程序的支持，各个站长做建站服务，目前好推网不提供域名绑定服务，主要通过在网站上投放广告来维持运营，并会根据各个网站运营的情况给站长分成。后续也会继续探索更多的盈利方式和站长一起来盈利。

最后，请原谅我们不能再继续陪您走下去，请不要忘记我们曾共同努力过的时光……

5d6d官方 2013.7

其余解决方案

图文无关

如果还想做论坛,可以参考以下几种方案[部分方案未考虑数据]:

5D6D新推荐的:好推
Google Site[比较麻烦]
新浪SAE,未亲测,做博客可以,论坛可能有难度
主机屋申请免费空间[然后自己建论坛]
导出5D6D的数据,可以用康盛的空间[需要备案过的域名]

说下,论坛因为管理难度比较大[个人觉得是比微博管理难度小一些的],做论坛还是慎重一些.

谢谢你5D6D,再见!

2013年 8月
一	二	三	四	五	六	日
			1	2	3	4
5	6	7	8	9	10	11
12	13	14	15	16	17	18
19	20	21	22	23	24	25
26	27	28	29	30	31