zoukankan      html  css  js  c++  java
  • NET使用Js调用WebService

    注:JsWebServiceObject 此类是我做测试示例时为了测试js是否能调用webService中的复合类型而单独新建的一个类

      此类中只有名字与年龄的属性。

    最近身边的一个朋友做项目,其中有一个模块需求要求使用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>

     示例下载地址:/Files/homezzm/Js调用WebService.rar 

  • 相关阅读:
    SnappyHexMesh(之七)创建二维几何体
    SnappyHexMesh(之六)体加密
    SnappyHexMesh(之五)面加密
    SnappyHexMesh(之四)面贴合参数
    SnappyHexMesh(之三)全局参数
    SnappyHexMesh(之二)背景网格
    SnappyHexMesh(之一)算法详述
    【转】编译EDEM2018+Fluent19.0耦合接口
    【读MFiX源代码】2 读time march loop(dt_loop)(仍在mfix.f)
    【转】linux下每间隔一段时间执行一个脚本
  • 原文地址:https://www.cnblogs.com/homezzm/p/1657235.html
Copyright © 2011-2022 走看看