jQuery调用页面后台方法

最新推荐文章于 2018-08-13 18:13:00 发布

木子木啊

最新推荐文章于 2018-08-13 18:13:00 发布

阅读量617

点赞数

分类专栏： JavaScript 文章标签： jQuery调用页面后台方法

本文链接：https://blog.csdn.net/xiao_chengzj/article/details/18555611

版权

JavaScript 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="JqueryCSMethodForm.aspx.cs" Inherits="JQuerWeb.JqueryCSMethodForm" %>  
<!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" src="JS/jquery-1.4.2.js"></script>  
     
    <script type="text/javascript">  
        $(document).ready(function() {  
            $("input[type='button'][value='GetDate']").click(function() {  
                $.ajax({  
                    type: "post",  
                    url: "JqueryCSMethodForm.aspx/GetNowDate",  
                    datatype: "json",  
                    contentType: "application/json; charset=utf-8",  
                    success: function(data) {  
                        $("input#showTime").val(eval('(' + data.d + ')')[0].nowtime);  
                    },  
                    error: function(XMLHttpRequest, textStatus, errorThrown) {  
                        alert(errorThrown);  
                    }  
                });  
            });  
            $("input[type='button'][value='GetOneDayLater']").click(function() {  
                $.ajax({  
                    type: "post",  
                    url: "JqueryCSMethodForm.aspx/GetOneDayLate",  
                    data:"{days:1}",  
                    datatype: "json",  
                    contentType: "application/json; charset=utf-8",  
                    success: function(data) {  
                        $("input#showTime").val(eval('(' + data.d + ')')[0].nowtime);  
                    },  
                    error: function(XMLHttpRequest, textStatus, errorThrown) {  
                    alert(errorThrown);  
                    }  
                });  
            });  
        });  
        
    </script>  
</head>  
<body>  
    <form id="form1" runat="server">  
    <div>  
        <input type="button" value="GetDate" />  
        <input type=button value="GetOneDayLater" />  
        <input type="text" id="showTime" />  
    </div>  
    </form>  
</body>  
</html>

using System;  
using System.Collections.Generic;  
using System.Linq;  
using System.Web;  
using System.Web.UI;  
using System.Web.UI.WebControls;  
using System.Web.Services;  
namespace JQuerWeb  
{  
    public partial class JqueryCSMethodForm : System.Web.UI.Page  
    {  
         
        protected void Page_Load(object sender, EventArgs e)  
        {  
            
        }  
        [WebMethod]  
        public static String GetNowDate()  
        {  
            return "[{\"nowtime\":\"" + DateTime.Now.ToShortDateString() + "\"}]";  
        }  
        [WebMethod]  
        public static String GetOneDayLate(Int32 days)  
        {  
            return "[{\"nowtime\":\"" + DateTime.Now.AddDays(days).ToShortDateString() + "\"}]";  
        }  
    }  
}

注意点：

(1) url的填写格式　url+"/method name"

(2) contentType: "application/json; charset=utf-8", 这个必须要有

(3) 返回数据的类型为json

(4) data:"{days:1}",参数的传递

(5) 后台的方法必须是public static 而且还要有 [WebMethod]特性修饰