欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

对Jquery中的ajax再封装,简化操作示例

程序员文章站 2022-05-30 22:57:30
代码如下:

代码如下:

<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "https://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
    <title>jqueryajaxjson取值示例</title>
    <script type="text/javascript" src="scripts/jquery-1.4.4.min.js"></script>
    <script type="text/javascript">
        $(function () {
            jsonajax("ajaxquery.x", "type=json", "json", callback);
            jsonajax("ajaxquery.aspx", "id=1&name=2&type=text", "text", callbacktxt);
        });

 

        function callback(data) {
            $("#ddd").html('');
            var json = eval(data); //数组 
            $.each(json, function (index, item) {
                //循环获取数据
                var name = json[index].name;
                var age = json[index].age;
                var sex = json[index].sex;
                $("#ddd").html($("#ddd").html() + "<br>" + name + "  " + age + "  " + sex + "<br/>");
            });
        };
        function callbacktxt(data) {
            $("#ccc").html(data);
        };

        /**
        * ajax post提交
        * @param url
        * @param param
        * @param datat 为html,json,text
        * @param callback回调函数
        * @return
        */
        function jsonajax(url, param, datat, callback) {
            $.ajax({
                type: "post",
                url: url,
                data: param,
                datatype: datat,
                success: callback,
                error: function () {
                    jquery.fn.mbox({
                        message: '恢复失败'
                    });
                }
            });
        }

    </script>
</head>
<body>
    <span id="ccc"></span>
    <span id="ddd"></span>
</body>
</html>


代码如下:


using system;
//新增
using system.web.script.serialization;
using system.collections.generic;

 

public partial class ajaxquery : system.web.ui.page
{
    protected void page_load(object sender, eventargs e)
    {
        if (!ispostback)
        {
            //数据模拟,仅供参考
            string messgage = string.empty;
            string id = request["id"];
            string name = request["name"];
            string gettype = request["type"];
            if (gettype=="text")
            {
                messgage = (id == "1" && name == "2") ? "ok符合条件" : "sorry不符合条件";
            }
            else if (gettype == "json")
         nbsp;   {
                list<student> list = new list<student>();
                for (int i = 0; i < 50; i++)
                {
                    student a = new student();
                    a.name = "张三" + i;
                    a.age = i;
                    a.sex = "男";
                    list.add(a);
                }
                messgage = new javascriptserializer().serialize(list);
            }
            else
            { }
            response.write(messgage);
            response.end();
        }
    }
    public struct student
    {
        public string name;
        public int age;
        public string sex;
    }
}