使用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;
});
}
相关文档:
var x,y;
//这是一个通过AJAX取得提示信息的方法
function over(noteContent){
//记录事件发生时的鼠标位置
x = event.clientX;
y = event.clientY;
//显示工具提示
document.getElementById(" ......
今天,有同事发现相关业务数据修改后,在IE6下还是显示修改前的值。但在其他浏览器和IE7、IE8下,没有这个问题。
原因:用ajax请求时,如果出现重复的URL,浏览器不会向服务器发送请求,而是根据之前相同的URL请求结果返回。原因就在于之前的请求及结果已经保存在了
缓存里,如果遇到相同URL时,结果是直接从缓存里取得。 ......
function saveObj(){
var userName = document.getElementById("userName").value;
checkUserName(userName);
}
//使用ajax实现页面无刷新功能;
var xmlHttpRequest;
function createXMLHttpRequest(){
if(windo ......
用的标签有ScriptManager,UpdatePanel,UpdateProgress ,主要的是UpdatePanel中的Triggers属性一定要对。
前台代码
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdateP ......
用Ajax实现Tab效果的
先创建
ajax.php,在其中输入如下代码:
<!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>
<title>Sample 2_1</title>
<me ......