JS调用WebService示例

 　要想实现JS调用WebService,可以按如下步骤实现(经过测试)：

第一步：创建一个WebService

 　　在此处我就创建了一个默认的web服务，并不做什么修改，把主要集力放在怎么实现JS调Web服务上面。

using System;
using System.Collections.Generic;
using System.Web;
using System.Web.Services;

// / <summary>
// /WebService 的摘要说明
// / </summary>
[WebService(Namespace = " http://tempuri.org/ " )]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
public class WebService : System.Web.Services.WebService
{

    public WebService()
    {

        // 如果使用设计的组件，请取消注释以下行
        // InitializeComponent();
    }

    [WebMethod]
    public string HelloWorld()
    {
        return " Hellow World " ;
    }

}

   
   

    
    第二步：创建一个页面，实现JS调用Web服务  
   
   
   
   

    
    <%
    
    @ Page Language
    
    =
    
    "
    
    C#
    
    "
    
     AutoEventWireup
    
    =
    
    "
    
    true
    
    "
    
     CodeFile
    
    =
    
    "
    
    Default3.aspx.cs
    
    "
    
     Inherits
    
    =
    
    "
    
    Default3
    
    "
    
     
    
    %>
    
    


    
    <!
    
    DOCTYPE html PUBLIC 
    
    "
    
    -//W3C//DTD XHTML 1.0 Transitional//EN
    
    "
    
     
    
    "
    
    http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd
    
    "
    
    >
    
    

    
    <
    
    html xmlns
    
    =
    
    "
    
    http://www.w3.org/1999/xhtml
    
    "
    
    >
    
    

    
    <
    
    head runat
    
    =
    
    "
    
    server
    
    "
    
    >
    
    
    
    
    <
    
    title
    
    ><
    
    /
    
    title>
    
    

    
    
    
    
    <
    
    script type
    
    =
    
    "
    
    text/javascript
    
    "
    
    >
    
    
        
    
    function
    
     RequestWebService() {
            
    
    //
    
    这是我们在第一步中创建的Web服务的地址
    
    

    
                
    
    var
    
     URL 
    
    =
    
     
    
    "
    
    http://localhost/YBWS/WebService.asmx
    
    "
    
    ;
            
            
    
    //
    
    在这处我们拼接
    
    

    
                
    
    var
    
     data;
            data 
    
    =
    
     
    
    '
    
    <?xml version="1.0" encoding="utf-8"?>
    
    '
    
    ;
            data 
    
    =
    
     data 
    
    +
    
     
    
    '
    
    <soap12:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap12="http://www.w3.org/2003/05/soap-envelope">
    
    '
    
    ;
            data 
    
    =
    
     data 
    
    +
    
     
    
    '
    
    <soap12:Body>
    
    '
    
    ;
            data 
    
    =
    
     data 
    
    +
    
     
    
    '
    
    <HelloWorld xmlns="http://tempuri.org/" />
    
    '
    
    ;
            data 
    
    =
    
     data 
    
    +
    
     
    
    '
    
    </soap12:Body>
    
    '
    
    ;
            data 
    
    =
    
     data 
    
    +
    
     
    
    '
    
    </soap12:Envelope>
    
    '
    
    ;
            
            
    
    //
    
    创建异步对象
    
    

    
                
    
    var
    
     xmlhttp 
    
    =
    
     
    
    new
    
     ActiveXObject(
    
    "
    
    Microsoft.XMLHTTP
    
    "
    
    );
            xmlhttp.Open(
    
    "
    
    POST
    
    "
    
    , URL, 
    
    false
    
    );
            xmlhttp.SetRequestHeader(
    
    "
    
    Content-Type
    
    "
    
    , 
    
    "
    
    application/soap+xml
    
    "
    
    );
            xmlhttp.Send(data);

            document.getElementById(
    
    "
    
    data
    
    "
    
    ).innerHTML 
    
    =
    
     xmlhttp.responseText;
        }        
    
    
    <
    
    /
    
    script>
    
    

    
    

    
    <
    
    /
    
    head>
    
    

    
    <
    
    body
    
    >
    
    
    
    
    <
    
    form id
    
    =
    
    "
    
    form1
    
    "
    
     runat
    
    =
    
    "
    
    server
    
    "
    
    >
    
    
    
    
    <
    
    div
    
    >
    
    
        
    
    <
    
    input id
    
    =
    
    "
    
    One
    
    "
    
     type
    
    =
    
    "
    
    button
    
    "
    
     value
    
    =
    
    "
    
    JsCallWebService
    
    "
    
     onclick
    
    =
    
    "
    
    RequestWebService()
    
    "
    
     
    
    /
    
    >
    
    

    
        
    
    <
    
    /
    
    div>
    
    

    
        
    
    <
    
    div id
    
    =
    
    "
    
    data
    
    "
    
    >
    
    
    
    
    <
    
    /
    
    div>
    
    

    
        
    
    <
    
    /
    
    form>
    
    

    
    <
    
    /
    
    body>
    
    

    
    <
    
    /
    
    html>
    
    

    
    
 
当点击按钮时，效果如下图：