• jquery异步调用页面后台方法‏


    jquery调用页面后台方法‏如下:

    给出了两个简单的例子,无参数的和有参数的,返回的都是json数据。

    <%@ 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>

    CS代码:

    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]特性修饰

  • 相关阅读:
    vs code快捷键
    封装一个运动函数
    关于数组操作方式的总结
    学习html/css基础的重点笔记
    web新手——新闻列表这样写不容易出错
    AppCan——生成Web/微信App版,调用微信JSAPI支付方式,提示WeixinJSBridge内置对象undefined
    vue slot 占位符
    vue /deep/ css 不用1级1级找了
    vue 双向绑定 2个{{}}
    axios 请求接口 f12可以返回值 但是控制台打印报错
  • 原文地址:https://www.cnblogs.com/liyuxin/p/1967776.html
Copyright © 2020-2023  润新知