首页 > > 网络编程 > Asp.Net编程 >

ASP.net jQuery调用webservice返回json数据的一…

2018-06-22 07:46:58来源：未知阅读 ()

之前寒假时，试着使用jQuery写了几个异步请求demo，

但是那样是使用的webform普通页面，一般应该是用 webservice 居多。

最近写后台管理时，想用异步来实现一些信息的展示和修改，

这是第一次真正的在实际中运用ajax，卡了一个小时才做好简单的信息展示。

在这之间遇到了两个问题。写下来分享给大家，也加深一下自己的印象。

有错误的地方还请大神指出。

前端js代码：

 1     <script type="text/javascript">
 2         $(function () {
 3             $("#details").hide();
 4             $(".details").click(function () {
 5                 showdetails($(this).attr("id"));
 6             });
 7         })
 8 
 9         function showdetails(id) {
10             $.ajax({
11                 url: "article.asmx/GetArticleByID",
12                 type: "POST",
13                 datatype: "json",
14                 data:'{ id: ' + id + ' }',
15                 contentType: "application/json; charset=utf-8",
16                 success: function (data) {
17                     var json = null;
18                     try {
19                         json = eval('(' + data.d + ')');
20                     }
21                     catch (e) {
22                         alert(e.message);
23                     }
24                     $("#id").text(json.ID);
25                     $("#title").text(json.Title);
26                     $("#time").text(json.Time);
27                     $("#text").text(json.Text);
28                     $("#details").show();
29                 }
30             });
31     </script>

前端html代码

 1 //点击的地方
 2 <td><a class="details" id="<% =Convert.ToInt32(article.ID) %>">详细</a></td>
 3 
 4 //插入信息的地方
 5     <div id="details">
 6         <table>
 7             <tr>
 8                 <td id="id"></td>
 9                 <td id="title"></td>
10                 <td id="time"></td>
11                 <td id="text"></td>
12             </tr>
13         </table>
14     </div>

webservice 代码

 1     [WebService(Namespace = "http://tempuri.org/")]
 2     [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
 3     [System.ComponentModel.ToolboxItem(false)]
 4     // 若要允许使用 ASP.NET AJAX 从脚本中调用此 Web 服务，请取消注释以下行。 
 5     [System.Web.Script.Services.ScriptService]
 6     public class article : System.Web.Services.WebService
 7     {
 8 
 9         [WebMethod]
10         public string GetArticleByID(int id)
11         {
12             ArticleBLL article = new ArticleBLL();
13             article = ArticleBLL.GetArticleByID(id);
14 
15             //string s = string.Empty;
16             //s = "{\"id\":\""+article.ID+"\",\"title\":\""+article.Title+"\",\"text\":\""+article.Text+"\",\"time\":\""+article.Time+"\"}";
17             //return s;
18 
19             JavaScriptSerializer js = new JavaScriptSerializer();
20             return js.Serialize(article);
21 
22             //Context.Response.Write(s);
23             //Context.Response.End();
24         }
25     }