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>

原文地址:https://www.cnblogs.com/xiaogelove/p/2343574.html