·您现在的位置： 云翼网络 >> 文章中心 >> 网站建设 >> 网站建设开发 >> ASP网站建设 >> NET-使用Js调用WebService

【如有意向点此提交需求】关于我们

NET-使用Js调用WebService

作者：佚名      ASP网站建设编辑：admin      更新时间：2022-07-23
最近身边的一个朋友做项目，其中有一个模块需求要求使用js去调用webService，让我帮着想想招，因为以前却实没有这么做过。经过大约一个小时的测试，成功了。发现这个东东写出来之后是这么简单。当初是我想复杂了。分享一下测试时写的代码，希望对大家有所帮助。

WebService文件内容



代码
using System;using System.Web;using System.Collections;using System.Collections.Generic;using System.Web.Services;using System.Web.Services.PRotocols;using System.Web.UI.MobileControls;/// <summary>/// JsWebService 的摘要说明/// </summary>[WebService(Namespace = "http://tempuri.org/")][WebServiceBinding(ConformsTo = Wsiprofiles.BasicProfile1_1)][System.Web.Script.Services.ScriptService]public class JsWebService : System.Web.Services.WebService{    public JsWebService()    {        //如果使用设计的组件，请取消注释以下行         //InitializeComponent();     }    [WebMethod]    public string GetString()    {        return "GetString";    }    [WebMethod]    public string GetString(string name)    {        return string.Format("{0}欢迎您的到来!", name);    }    [WebMethod]    public List<string> GetList()    {        List<string> listStr = new List<string>();        for (int i = 0; i < 10; i++)        {            listStr.Add("test" + i);        }        return listStr;    }        [WebMethod]    public List<JsWebServiceObject> GetObjectList()    {        List<JsWebServiceObject> objs = new List<JsWebServiceObject>();        for (int i = 0; i < 10; i++)        {            JsWebServiceObject obj = new JsWebServiceObject("name" + i, i + 20);            objs.Add(obj);        }        return objs;    }}


调用WebService的aspx页面代码

代码
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server">    <title>Js调用WebService</title>    <script type="text/javascript">        function GetString()        {            JsWebService.GetString(GetStringCallBack);  //在WebService中调用方法，并设置回调函数        }        function GetStringCallBack(result)          {            alert(result);        }                function GetStringParam(name)        {            JsWebService.GetString(name,GetStringParamCallBack);  //在WebService中调用方法，并设置回调函数，如果此方法中带有参数则在回调函数前加入此参数。        }        function GetStringParamCallBack(result)        {            alert(result);        }                function GetList()        {            JsWebService.GetList(GetListCallBack);        }        function GetListCallBack(result)        {            if(result.length!=0)            {                for(var i=0;i<result.length;i++)                {                    document.getElementById("contentDivGetList").innerHTML += result[i] + "<br/>";                }            }        }                function GetObjectList()        {            JsWebService.GetObjectList(GetObjectListCallBack);        }        function GetObjectListCallBack(result)        {            if(result.length!=0)            {                for(var i=0;i<result.length;i++)                {                    document.getElementById("contentDivGetObjectList").innerHTML += "姓名:" + result[i].Name + "  年龄:" + result[i].Age + "<br/>";                }            }        }            </script></head><body>    <form id="form1" runat="server">            <asp:ScriptManager ID="smJs" runat="server" >            <Services>                <asp:ServiceReference Path="WebService/JsWebService.asmx" />            </Services>        </asp:ScriptManager>                <div>                    <input type="button" name="btnJsWebService" value="GetString" onclick="GetString()" />            <input type="button" name="butJsWebService" value="GetList" onclick="GetList()" />            <input type="button" name="butJsWebService" value="GetObjectList" onclick="GetObjectList()" />            <input type="button" name="butJsWebService" value="GetStringParam" onclick="GetStringParam('js调用WebService')" />                        <div id="contentDivGetList"></div>            <div id="contentDivGetObjectList"></div>                    </div>    </form></body></html>