这就是您将使用 AJAX 的目的。这些答案假设您在同一个域上工作。
简单的方法
使用 AJAX 最简单的方法是使用 jQuery,但这并不是绝对必要的(见下文)。 http://www.queness.com/post/160/create-a-ajax-based-form-submission-with-jquery
通用样本:
$.ajax({
url: "test.html",
context: document.body
}).done(function() {
$(this).addClass("done");
});
http://api.jquery.com/jQuery.ajax/
不太容易的方法
如果你不想使用 jQuery,你可以不用它。 http://www.webreference.com/programming/javascript/ajax_forms/index.html
示例 HTML
<p><html><br/>
<head><br/>
<title>Form Posts with Ajax</title><br/>
<script type="text/javascript" src="js/Ajax.js"></script><br/>
<script type="text/javascript" src="js/Post.js"></script><br/>
</head><br/><br/>
<body><br/><br/>
<form action="bridge.php" method="post" onsubmit="Post.Send(this); return false;"><br/>
Name:<br/><input type="text" name="name" /><br/>
<br/><br/><br/>
Message:<br/><textarea name="message"></textarea><br/>
<br/><input type="submit" value="submit" /><br/>
</form><br/><br/>
</body><br/>
</html></p>
示例 JavaScript
var Ajax = new Object();
Ajax.isUpdating = true;
Ajax.Request = function(method, url, query, callback)
{
this.isUpdating = true;
this.callbackMethod = callback;
this.request = (window.XMLHttpRequest)? new XMLHttpRequest(): new ActiveXObject("MSXML2.XMLHTTP");
this.request.onreadystatechange = function() { Ajax.checkReadyState(); };
if(method.toLowerCase() == 'get') url = url+"?"+query;
this.request.open(method, url, true);
this.request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
this.request.send(query);
}
Ajax.checkReadyState = function(_id)
{
switch(this.request.readyState)
{
case 1: break;
case 2: break;
case 3: break;
case 4:
this.isUpdating = false;
this.callbackMethod(this.request.responseXML.documentElement);
}
}