• JQ异步调用


      AjaxGet请求方式:

    <script type="text/javascript">
        $.ajax({
            type: "GET",
            dataType: "html",
            url: "test.htm",
            data: {}, //参数信息,采用JS对象的形式,也可以使用URL地址比较传统的&将参数分隔
            error: function () {
                alert("获取数据失败");
            },
            beforeSend: function () {
                alert("发送请求之前出现错误");
            },
            success: function (data) {
                $("#list").html(data)
            }
        });
    </script>
    View Code

    test.htm文档内容:

    <ul>
    <li>data:td</li>
    <li>infomation:ok</li>
    </ul>

    Post请求操作数据:

     $.ajax({
            type: 'POST',
            data: { name: 'td', email: 'td@qq.com', addr: 'china' },
            url: '/ajax/insert.ashx',//一般处理程序
            success: function (data) {
                if (data.res) {
                    alert('操作成功');
                }
            }
        });
    View Code

    注意:AJAX可以跨域发GET请求,来读取数据,但不可以发POST请求,因为这样不安全

    ajax跨域Get请求:

      $.ajax({
            type: 'GET',
            dataType: 'jsonp',
            jsonp: "jsonpcallback", //需要与服务端的jsonp字符匹配
            url: 'http://www.baidu.com/ajax/test.',
            success: function (data) {
                $('#result').html(data);
            }
        });
    View Code

    简写形式:

    1 远程载入html文件并插入DOM中

     $("#load").load("ajaxData.htm");

    2 $.get()向指定页面发Get请求

      $.get("ajaxData.htm", function (data) {
                $("#gets").html(data);
            }, "html");

    3 $.getJSON() 从指定页面获取JSON对象

        $.getJSON("json.js", function (json) {
            alert("OK");
            $("#getjsons").attr({ "src": json[0].src, "alt": json[0].alt });
        });

    4 $.getScript() 装载指定js文件

     $.getScript("img.js", function () { alert("img.js装载成功!") });

    5 $.post() 向指定页面发post请求

     $.post("test.ashx", { name: "John", time: "2pm" }); //普通参数
     $.post("test.ashx", $("#testform").serialize()); //表单参数(序列化表单参数,实现上把参数用&分开的)

    6 序列化表单元素

    $("form").serialize()

    7 序列化表格元素返回 JSON 数据结构数据

    console.log($("form").serializeArray());
  • 相关阅读:
    【SpringMVC】SpringMVC系列15之SpringMVC最佳实践
    【SpringMVC】SpringMVC系列14之SpringMVC国际化
    could not calculate build plan: Plugin org.apache.maven.plugins:maven-resources-plugin:2.5 or one of(maven报错)
    ubuntu14安装tensorflow并测试
    HTMLajax跨域向服务器写入数据
    eclipse的最新版本luna的中建立svn和maven
    关于equals与hashcode的重写
    会计中的冲销和红票
    dubbo在项目中的应用
    dubbo介绍以及创建
  • 原文地址:https://www.cnblogs.com/niuzaihenmang/p/5629036.html
Copyright © 2020-2023  润新知