使用jQuery实现Ajax异步提交表单实现局部刷新
jQuery学习笔记
提交form表单之后，不会刷新页面，而是局部刷新，欲提交的form只要有id即可
如果使用get请求，注意中文乱码问题，jquery会先使用iso8859-1解码，然后发给服务器，如果使用post请求，则直接将中文内容提交给服务器解析。
使用jquery-1.4.2.js和jquery.form.js插件。
如果创建新的js文件中，需要加上
document.write("<script type='text/javascript' src='jquery-1.4.2.js'></script>")
document.write("<script type='text/javascript' src='jquery.form.js'></script>")
// 动态加载页面
// id 显示页面的容器组件ID2
// url 欲加载页面网址
// gop get请求还是post请求，默认get
function loadPage(id, url, gop) {
$("#" + id).addClass("loader");
$("#" + id).append("Loading......");
var type = (gop == "post" ? "post" : "get");
$.ajax( {
type : type,
url : url,
cache : false,
error : function() {
alert('加载页面' + url + '时出错！')
},
success : function(content) {
$("#" + id).empty().append(content);
$("#" + id).removeClass("loader");
}
});
}
// 局部提交表单
function formSubmit(formId, divId, url) {
$('#' + formId).submit(function() {
$(this).ajaxSubmit( {
target : '#' + divId,
url : url,
error : function() {
alert('加载页面' + url + '时出错！')
}
});
return false;
});
}
相关文档：
应项目需求，测试了下自动发送邮件的功能，以实现，下面分别介绍前台的Ajax和后台c#
前台：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="SendEmail.aspx.cs" Inherits="SendEmail" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1- ......
<input type="button" onclick="ajaxTest()" value="AJAX测试">
<input type="button" onclick=" document.getElementById('weather').innerHTML='' " value="隐藏">
<mce:script type="text/javascript"><!--
// 1. 初始化 请求 对象
// Mozilla/Firefox 下的
//var xmlhttp = ne ......
web2.0横空出世，ajax首当其冲，今天做web的如果再不学点ajax的话，就显的落伍了，而学ajax的用的环境如果是asp.net，那ajax.net你就不得不学了。首先就是环境的配置，如下
vs2005+sql2005+Winxp sp2+ie6.0+Office2003环境设置如下：
下载完 ASPAJAXExtSetup.msi 安装更新后在你的系统盘下的（以C盘为例） 出现这个 文� ......
1）发送路径中的参数有中文，在服务器端接收参数值是乱码
解决方法：
PHP:
服务器端：iconv("UTF-8","gb2312",$_POST[变量名]);
JSP:
客户端:
利用javascript的提供的escape()或encodeURI()方法, 例
var url="a.jsp?name=小李"；
url=encodeURI(url);
url=encodeURI(url); //两次，很关键[具体为什么，我也不清楚 ......
如上图所示为Accordion控件：
感觉不错的样式
<style type="text/css">
.headerBg{cursor:hand;text-align:center;width:180px;height:21px;background-image:url(images/ajaxmenubg1.gif);FONT-SIZE: 12px;line-height:21px;} ......
