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调用服务器端的方法很好用。

原文地址:https://www.cnblogs.com/zhouxiuquan/p/3669132.html