首先新建項目,這里有兩種調用方式,為了能方便理解,新建頁面WebserviceTest如下圖:

先引用寫好的服務,這里用上次寫好的服務。見上次寫的一個簡單的Webservice的demo,簡單模擬服務。
這里我們要新建一個服務,調用我們引用給服務。因為一般情況下js不能跨域訪問服務的,當然,只是一般,要非得跨域訪問也行,網上搜方法,但是那樣做就沒意義了。新建服務,取名MyJsWebservice,如下圖:

在服務中調用引用的服務,並將Ajax腳本調用改取消的注釋取消。如下圖:

生成以下解決方案,現在我們在頁面上調用。使用jQuery,Ajax調用。
前端代碼:
1 <head runat="server"> 2 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 3 <title>WebserviceTest</title> 4 <script src="jquery-1.7.2.min.js"></script> 5 <script type="text/javascript"> 6 $(function () { 7 $("#btnSure").click(function () { 8 var birthday = $("#birthday").val(); 9 $.ajax({ 10 type: "Post", //Post傳參 11 url: "/MyJsWebservice.asmx/WhoAreYou",//服務地址 12 data: "{birthday:'"+birthday+"'}",//參數 13 dataType: "json", 14 contentType: "application/json;charset=utf-8", 15 success: function (result) { 16 // 調用成功后,將獲取的名字填入name文本框中。 17 $("#name").val(result.d); 18 }, 19 error: function (e) { 20 window.alert(e.status); 21 } 22 }) 23 }) 24 }) 25 </script> 26 </head> 27 <body> 28 <form id="form1" runat="server"> 29 <div> 30 請輸入您的生日: 31 <input type="text" id="birthday" /> 32 <input type="text" id="name" /><input type="button" id="btnSure" value="確 定" /> 33 </div> 34 </form> 35 </body>
測試成功:
![]()
