zoukankan      html  css  js  c++  java
  • ajax 基本写法以及jquery现在常用写法

    c# ajax 基本写法 现在都用jquery的ajax 函数了,但是不要忘记基本写法哦 

    <script type="text/javascript">
            $(function()
            {
                var xhr = new AjaxXmlHttpRequest();
                $("#btnAjaxOld").click(function(event)
                {
                    var xhr = new AjaxXmlHttpRequest();

    //XMLHTTP默认(也推荐)不是同步请求的,也就是open方法并不像WebClient的DownloadString那样把服务器返回的数据拿到才返回,是异步的,因此需要监听onreadystatechange事件。
                    xhr.onreadystatechange = function()
                    {
                        if (xhr.readyState == 4)//表示服务器完成
                        {

                             if(xhr.status == 200)//如果状态码为200则是成功

                              {
                              document.getElementById("divResult").innerHTML = xhr.responseText;

                              }else {
                              alert("AJAX服务器返回错误!")
                             }
                        }
                    }
                    xhr.open("GET", "data/AjaxGetCityInfo.aspx?resultType=html", true);
                    xhr.send(null);
                });
            })

            //跨浏览器获取XmlHttpRequest对象
            function AjaxXmlHttpRequest()
            {
                var xmlHttp;
                try
                {
                    // Firefox, Opera 8.0+, Safari
                    xmlHttp = new XMLHttpRequest();
                }
                catch (e)
                {

                    // Internet Explorer
                    try
                    {
                        xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
                    }
                    catch (e)
                    {

                        try
                        {
                            xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
                        }
                        catch (e)
                        {
                            alert("您的浏览器不支持AJAX!");
                            return false;
                        }
                    }
                }
                return xmlHttp;
            }       
        </script>

    jquery ajax 常用写法

    列表页面

    <script language="javascript" type="text/javascript">
        function InitList() {
            $("#liststr").html("");
            var strhtml = "";
            $.ajax({
                type: "POST",
                contentType: "application/json",
                url: "WS_Page.asmx/InitList",
                data: "{id:'" + $("#txtId").val() + "',url:'" + $("#txtUrl").val() + "',ip:'" + $("#txtIp").val() + "'}",
                datatype: 'json',
                cache: false,
                success: function(json) {
               
                    var objlist = eval(json.d);
                    $.each(objlist, function(n, obj) {

                        strhtml += "<tr >";
                        strhtml += "<td>";
                        strhtml += obj.id;
                        strhtml += "</td>";
                        strhtml += "<td>";
                        strhtml += obj.url;
                        strhtml += "</td";
                        strhtml += "<td>";
                        strhtml += obj.ip;
                        strhtml += "</td>";
                        strhtml += "<td>";
                        strhtml += obj.updatetime;
                        strhtml += "</td>";
                        strhtml += "<td>";
                        strhtml += "<input type='button' value='编辑'onclick='javascript:location.href=\"Manager.aspx?id=" + obj.id + "\"'/>&nbsp&nbsp;";
                        strhtml += "<input type='button' value='删除'onclick='deleteInfo(" + obj.id + ")'/>";
                        strhtml += "</td>";
                        strhtml += "</tr>";
                    })     
                    $("#liststr").append(strhtml);

                },
                error: function(err) {
                    alert(err.responseText);
                }
            });

        }

        function deleteInfo(id) {
            if (!confirm('确定删除吗?')) return;
            if (isNaN(id)) {
                alert('参数错误');
                return;
            }
            $.ajax({
                type: 'POST',
                contentType: 'application/json',
                url: 'WS_Page.asmx/DeleteInfo',
                data: "{id:" + id + "}",
                dataType: 'json',
                cache: false,
                success: function(json) {
                    if (json.d == "success") {
                        alert('删除成功!');
                        InitList();
                    } else {
                        alert(json.d);
                    }
                },
                error: function(err) {
                    alert(err.responseText);
                }
            });
        }

        $(document).ready(function() {
         InitList();
        });
    </script>

     //manager 页面

     

    <script language="javascript" type="text/javascript">

        var id = $.query.get('id');//一定要引用一个插件 urlparameter.js 才能正常获取穿过来的参数。

        function getInfoById() {
            if(id!=""&& !isNaN(id)) {
                $.ajax({
                    type: "POST",
                    contentType: "application/json",
                    url: "WS_Page.asmx/getInfoById",
                    data: "{id:" + id + "}",
                    dataType: 'json',
                    cache: false,
                    success: function(json) {
                        var data = eval(json.d);
                        $("#txtIp").val(data[0].ip);
                        $("#txtUrl").val(data[0].url);
                    },
                    error: function(err) {
                        alert(err.responsetext);
                    }
                });
            }

        }

        function submitEvent() {
            if (id == "" || isNaN(id)) {

                $.ajax({
                    type: "POST",
                    contentType: "application/json",
                    url: "WS_Page.asmx/AddInfo",
                    data: "{url:'" + $("#txtUrl").val() + "',ip:'" + $("#txtIp").val() + "'}",
                    dataType: 'json',
                    cache: false,
                    success: function(json) {
                        if (json.d.indexOf("success") == 0) {
                            id = json.d.substring(7);
                            alert("添加成功!");
                        }
                        else {
                            alert(json.d);
                        }
                    },
                    error: function(err) {
                        alert(err.responseText);
                    }
                });
               
           
           
            } else {

                $.ajax({
                    type: "POST",
                    contentType: "application/json",
                    url: "WS_Page.asmx/UpdateInfo",
                    data: "{url:'" + $("#txtUrl").val() + "',ip:'" + $("#txtIp").val() + "',id:" + id + "}",
                    dataType: 'json',
                    cache: false,
                    success: function(json) {
                        if (json.d == "success") {
                            alert("修改成功!");
                        } else {
                            alert(json.d);
                        }
                    },
                    error: function(err) {
                        alert(err.responsetext);
                    }

                });
            }

        }
      
        $(document).ready(function() {
            getInfoById();
        });
    </script>

  • 相关阅读:
    (转)软件架构设计
    (转)IDG副总裁楼军:顶级VC青睐什么样的创业者
    (转)使用Aspose.Cell控件实现Excel高难度报表的生成(一)
    (转)创业者应该有的5个正常心态
    (转)成功创业者的7个好习惯
    (转)SqlServer2008 数据库同步的两种方式 (发布、订阅)
    (转)Salesforce的440亿美金并购宣告企业软件市场进入3.0互联网化时代
    (转)创始人之间如何分股权:按贡献估值
    (转)各种大型网站技术架构
    使用FileSystem类进行文件读写及查看文件信息
  • 原文地址:https://www.cnblogs.com/xiaogelove/p/2343574.html
Copyright © 2011-2022 走看看