prototype-1.6.0.2.js 之Ajax
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Ajax.aspx.cs" Inherits="Web.Ajax" %>
<!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>Ajax</title>
<script type="text/javascript" language="javascript" src="js/prototype-1.6.0.2.js"></script>
<script type="text/javascript" language="javascript">
function SignIn1()
{
var u = $("userName").value;
var p = $("password").value;
new Ajax.Request('ajax.aspx?t=si&userName=' + u + '&password=' + p,
{
method:'get',
onSuccess: function(transport){
var response = transport.responseText || "no response text";
alert("Success! \n\n" + response);
},
onFailure: function(){ alert('Something went wrong
') }
});
}
function SignIn2()
{
var u = $("userName").value;
var p = $("password").value;
var pars = "&userName=" + u + "&password=" + p;
new Ajax.Request('ajax.aspx?t=si',
{
method:"post",
parameters:pars,
onSuccess: function(transport){
var response = transport.responseText || "no response text";
alert("Success! \n\n" + response);
},
onFailure: function(){ alert('Something went wrong') }
});
}
function SignIn3()
{
var u = $("userName").value;
var p = $("password").value;
new Ajax.Request('ajax.aspx?t=si',
{
method:'post',
parameters:$('form').serialize(),
onSuccess: function(transport){
var response = transport.responseText || "no response text";
alert("Success! \n\n" + response);
},
onFailure: function(){ alert('Something went wrong') }
});
}
function SignIn4()
{
var u = $("userName").value;
var p = $("password").value;
new Ajax.Request('ajax.aspx?t=si',
{
method:'post', // 使用GET也可以
parameters:{'userName' : u, 'password' : p},
onSuccess: function(transport){
var response = transport.responseText || "no response text";
alert("Success! \n\n" + response);
},
onFailure: function(){ alert('Something went wrong') }
});
}
/* Request和Updater的最大区别在于Updater返回的内容可以直接填充到第一个参数“result”*/
function SignIn()
{
var u = $("userName").value;
var p = $("password").value;
new Ajax.Updater('result', 'ajax.aspx?t=si',
{
method:'post', // 使用GET也可以
parameters:{'userName' : u, 'password' : p},
onSuccess: function(transport){
var response = transport.responseText || "no response text";
alert("Success! \n\n" + response);
},
onFailure: function(){ alert('Something went wrong') }
});
}
</script>
</head>
<body>
<form id="form" runat="server">
<div>
<input type="text" id="userName" name="userName" /><br />
<input type="text" id="password" name="userName" /><br />
<input type="button" id="btnSubmit" name="btnSubmit" onclick="SignIn()" value="提交"/>
<div id="result"></div>
</div>
</form>
</body>
</html>
<!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>Ajax</title>
<script type="text/javascript" language="javascript" src="js/prototype-1.6.0.2.js"></script>
<script type="text/javascript" language="javascript">
function SignIn1()
{
var u = $("userName").value;
var p = $("password").value;
new Ajax.Request('ajax.aspx?t=si&userName=' + u + '&password=' + p,
{
method:'get',
onSuccess: function(transport){
var response = transport.responseText || "no response text";
alert("Success! \n\n" + response);
},
onFailure: function(){ alert('Something went wrong
') }});
}
function SignIn2()
{
var u = $("userName").value;
var p = $("password").value;
var pars = "&userName=" + u + "&password=" + p;
new Ajax.Request('ajax.aspx?t=si',
{
method:"post",
parameters:pars,
onSuccess: function(transport){
var response = transport.responseText || "no response text";
alert("Success! \n\n" + response);
},
onFailure: function(){ alert('Something went wrong
') }});
}
function SignIn3()
{
var u = $("userName").value;
var p = $("password").value;
new Ajax.Request('ajax.aspx?t=si',
{
method:'post',
parameters:$('form').serialize(),
onSuccess: function(transport){
var response = transport.responseText || "no response text";
alert("Success! \n\n" + response);
},
onFailure: function(){ alert('Something went wrong
') }});
}
function SignIn4()
{
var u = $("userName").value;
var p = $("password").value;
new Ajax.Request('ajax.aspx?t=si',
{
method:'post', // 使用GET也可以
parameters:{'userName' : u, 'password' : p},
onSuccess: function(transport){
var response = transport.responseText || "no response text";
alert("Success! \n\n" + response);
},
onFailure: function(){ alert('Something went wrong
') }});
}
/* Request和Updater的最大区别在于Updater返回的内容可以直接填充到第一个参数“result”*/
function SignIn()
{
var u = $("userName").value;
var p = $("password").value;
new Ajax.Updater('result', 'ajax.aspx?t=si',
{
method:'post', // 使用GET也可以
parameters:{'userName' : u, 'password' : p},
onSuccess: function(transport){
var response = transport.responseText || "no response text";
alert("Success! \n\n" + response);
},
onFailure: function(){ alert('Something went wrong
') }});
}
</script>
</head>
<body>
<form id="form" runat="server">
<div>
<input type="text" id="userName" name="userName" /><br />
<input type="text" id="password" name="userName" /><br />
<input type="button" id="btnSubmit" name="btnSubmit" onclick="SignIn()" value="提交"/>
<div id="result"></div>
</div>
</form>
</body>
</html>
