Jquery 操作xml 文档的方法

需求： 页面上有两个下拉框，显示游戏大区 和游戏服务器，当游戏大区改变时，游戏服务器也跟着改变

界面部分html代码

<tr class="tkSigUser">
<th>游戏大区：</th>
<td>
<asp:DropDownList ID="gamezonedll"  runat="server"></asp:DropDownList>
</td>
<td></td>
</tr>
<tr class="tkSigUser">
<th>服务器名：</th>
<td>
<select id="serverddl" name="serverdll"></select>
<input type="hidden" name="serverName" />
</td>
<td></td>
</tr>

xml文档内容



在ready部分 页面初始化时根据大区ID加载服务器信息 ，当大区变更时change事件，服务器信息变化。

var xmDoc;//用于装载请求到的xml文档

使用ajax 异步请求xml文档并处理

$(document).ready(function () {

$.ajax({
url: "../js/xinhejiguang.xml",
dataType: 'xml',
type: 'get',
error: function () {
alert("加载区服信息失败");
},
success: function (xml) {
xmlDoc = xml; //将xml保存起来，可以在其他地方接着使用，不用再次请求
var gamezoneid = $("#<%=gamezonedll.ClientID %> option:selected").val();
findServer(gamezoneid);
}

});

$("#<%=gamezonedll.ClientID %>").change(function () {
var id = $("#<%=gamezonedll.ClientID %> option:selected").val();
$("#serverddl").empty();
findServer(id);
});

});

//根据大区ID，查找服务器信息并添加到 服务器节点
function findServer(zoneid) {
var gameServerList = $(xmlDoc).find("game[id='10123']").find("gameZone[id='"+zoneid+"']").find("gameServer");
gameServerList.each(function (index, content) {
var serverid = $(content).attr("id");
var servername = $(content).attr("name");
$("#serverddl").append("<option value='" + serverid + "'>" + servername + "</option>");
});

}

程序采用的是web form ,.net 2.0平台。所以使用了服务器端控件。开始的设想是 大区 、服务器都使用web服务器控件，在page_Load 方法中初始化加载区服信息，

用jquery 异步改变服务器的值，但是在提交时出现 回发或回调参数无效 的错误，

网上查找基本回答都是一样的 http://hi.baidu.com/chy_daima/item/733e963fd63dccb8134b148c
但是这些方法都不好用，简单方法 禁用 EnableEventValidation="false" ，会导致在behindcode 中获取不到你修改的控件的值，只是获取原来的值。

开始用js取新的服务器信息是用下边的方法：

webform 在前台js中调用后台代码的方法：

首先在Page_Load 中 写上

Ajax.Utility.RegisterTypeForAjax(typeof(xinhejiguang));

xinhejiguang 是后台的类名

然后再后台写方法

[Ajax.AjaxMethod(Ajax.HttpSessionStateRequirement.Read)]
public string GetGameServer(string zoneId)
{
XmlDocument jiguang = new XmlDocument();
string filepath = AppDomain.CurrentDomain.BaseDirectory + "zc\\js\\xinhejiguang.xml";
jiguang.Load(filepath);

XmlNode zonenode = jiguang.SelectSingleNode("/company/gameList/game[@name='极光世界']/gameZoneList/gameZone[@id=" + zoneId + "]");
XmlNodeList serverlist = zonenode.SelectNodes("gameServerList/gameServer");
StringBuilder buider = new StringBuilder();

foreach (XmlNode server in serverlist)
{
string serverid = server.Attributes["id"].Value;
string servername = server.Attributes["name"].Value;
buider.AppendFormat("{0}:{1}|", serverid, servername);
}

buider.Remove(buider.Length - 1, 1);
return buider.ToString();
}

那么 在前台 js 就可以通过

var id = 11159;
var result = xinhejiguang.GetGameServer(id).value;

来调用后台程序，得到服务器信息。然后再进行split 分割，加载。

这个方法对于用js调用服务器端的方法很好用。