在本文中，我们将深入探讨如何使用Ajax技术传递多个参数，并通过具体的代码实例来演示这一过程。Ajax（Asynchronous JavaScript and XML）是一种在不刷新整个页面的情况下与服务器交换数据并更新部分网页的技术，使得用户界面更加流畅和响应迅速。
让我们分析给定的HTML和JavaScript代码段：
```html
<html>
<head>
<title></title>
<script src="js/Jquery1.7.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$('#Button1').click(function () {
var username = $('#txtUserName').val();
var pwd = $('#txtPwd').val();
$.ajax({
type: "post",
contentType: "application/json",
url: "WebService1.asmx/Login",
data: "{username:'" + username + "',pwd:'" + pwd + "'}",
success: function (bukeyi) {
if (bukeyi.d == 'true') {
window.location = 'HTMLPage1.htm';
} else {
$('#divinfo').text("用户名或密码错误");
}
}
})
})
})
</script>
</head>
<body>
用户名<input id="txtUserName" type="text" />
<br />密码<input id="txtPwd" type="text" />
<br />
<input id="Button1" type="button" value="登录" />
<br />
<div id="divinfo"></div>
</body>
</html>
```
这段代码使用jQuery库来实现Ajax请求。当用户点击ID为`Button1`的按钮时，会触发一个事件处理函数。在这个函数中，获取两个输入字段`txtUserName`和`txtPwd`的值，分别代表用户名和密码。然后，使用`$.ajax()`方法发送一个POST请求到`WebService1.asmx/Login`。`data`参数是一个JSON格式的字符串，包含了要传递的用户名和密码。如果服务器返回的响应中的`d`属性等于`'true'`，则将页面重定向到`HTMLPage1.htm`；否则，在`divinfo`元素中显示错误信息。
接下来是服务器端的C#代码：
```csharp
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
namespace ajax11
{
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.ComponentModel.ToolboxItem(false)]
// 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务，请取消对下行的注释。
[System.Web.Script.Services.ScriptService]
public class WebService1 : System.Web.Services.WebService
{
// 其他方法...
[WebMethod]
public string Login(string username, string pwd)
{
if (username == "onlifes" && pwd == "password") // 这只是一个示例验证
{
return "true";
}
else
{
return "false";
}
}
}
}
```
在Web服务中，定义了一个名为`Login`的Web方法，它接收两个参数：`username`和`pwd`。这个方法执行简单的用户名和密码验证。如果验证通过，返回`"true"`；否则，返回`"false"`。
总结来说，Ajax传递多个参数的关键在于创建一个JSON格式的数据字符串，并将其作为`data`参数传递给`$.ajax()`方法。在服务器端，接收这些参数并根据它们执行相应的操作。在上面的示例中，我们使用了jQuery和C#，但同样的概念适用于其他JavaScript库（如axios、fetch等）以及不同的后端语言（如Java、PHP等）。重要的是确保客户端和服务器端的数据格式一致，以便正确地解码和处理传递的参数。
