2-jQuery - AJAX load() 方法【进阶篇】

第一篇的AJAX load() 方法过于简单，补充一下，完整的。

格式

$(selector).load(URL,data,callback);

源码

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
        <title></title>
        <style type="text/css">
            #dsh{width: 100%; height: 100px; border: red solid 1px;}
        </style>
    </head>
    <body>
        <div id="dsh"></div>
        <input type="button" id="actions" value="执行" onclick="ajx()"/>
        <script type="text/javascript">
            function ajx(){
                $("#dsh").load(
                     "file/xyj.txt",//加载的内容的URL
                      msg//执行加载后执行的函数，即回调函数callback
                )
            }
            function msg(responseTxt,statusTxt,xhr){
                if(statusTxt=="success"){alert("状态:"+statusTxt+‘\n‘+"内容:"+responseTxt);}
                if(statusTxt=="error"){alert("状态:"+statusTxt+‘\n‘+"错因: "+xhr.status+‘\n‘+"内容: "+xhr.statusText);}
              }
            /*说明：
            $(selector).load(URL,data,callback);
            必需的 URL 参数规定您希望加载的 URL。
            可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。

            可选的 callback 参数是 load() 方法完成后所执行的函数名称。
            msg为可选的 callback 参数规定当 load() 方法完成后所要允许的回调函数。
            回调函数可以设置不同的参数：
                responseTxt - 包含调用成功时的结果内容
                statusTXT - 包含调用的状态
                xhr - 包含 XMLHttpRequest 对象*/
        </script>

    </body>
</html>

如果成功则弹出

如果我故意把加载路径填错，即让其找不到加载文件，则会弹出

时间： 2024-10-06 00:38:34

2-jQuery - AJAX load() 方法【进阶篇】的相关文章

JavaScript教程之jQuery - AJAX load() 方法

jQuery - AJAX load() 方法 jQuery load() 方法 jQuery load() 方法是简单但强大的 AJAX 方法. load() 方法从服务器加载数据,并把返回的数据放入被选元素中. 语法: $(selector).load(URL,data,callback); 必需的 URL 参数规定您希望加载的 URL. 可选的 data 参数规定与请求一同发送的查询字符串键/值对集合. 可选的 callback 参数是 load() 方法完成后所执行的函数名称. 这是示例

jQuery – AJAX load() 方法

jQuery load() 方法 jQuery load() 方法是简单但强大的 AJAX 方法. load() 方法从服务器加载数据,并把返回的数据放入被选元素中. 语法: $(selector).load(URL,data,callback); 必需的 URL 参数规定您希望加载的 URL. 可选的 data 参数规定与请求一同发送的查询字符串键/值对集合. 可选的 callback 参数是 load() 方法完成后所执行的函数名称. 这是示例文件("demo_test.txt")

jQuery AJAX load() 方法

在ASP.NET MVC中使用jQuery的Load方法加载静态页面的一个注意点

使用使用jQuery的Load方法可以加载静态页面,本篇就在ASP.NET MVC下实现. Model先行: public class Article { public int Id { get; set; } public string Url { get; set; } } 在HomeController中的Index方法,向视图传递一个Article强类型. public class HomeController : Controller { public ActionResult Ind

使用jquery的load方法设计动态加载，并解决浏览器前进、后退、刷新等问题

继上一篇使用jquery的load方法设计动态加载,并解决被加载页面JavaScript失效问题解决了后台业务系统的部分动态加载问题,然而该框架离正常的用户体验还存在一些问题,如:浏览器的前进.后退.刷新等问题.有博友也遇到了同样的问题,接下来就针对浏览器的前进.后退.刷新进行用户体验优化. 在解决上述问题时也进行了各种search,但是大部分都是自己实现的插件,而且插件年久失修,对于新的jquery支持不佳.也有使用h5新加的history方法来实现的,由于HTML5的广泛使用,绝大部分主

关于使用jquery的load方法时被加载页面内部script失效问题的一次探索

事先声明:本文由初学者撰写,为一次探索的过程,可能有不严谨和准确的地方,望读者多多谅解并积极指正! 场景描述: 在一次前端开发过程中,我使用了一个网页模板,该模板包含一个主页和四个子页面,如下图: 具体的效果是,点击主页中的一个按钮会在弹框内显示子页面的内容,如下图: 具体的实现是在主页面中留出面板,并在点击按钮时通过jquery的load方法将子页面加载到面板中: index.html 部分代码 <div class="cd-folding-panel"> <div

2016 系统设计第一期（档案一）jQuery ajax serialize()方法form提交数据

jQuery ajax serialize()方法form提交数据,有个很奇怪的问题,好像不能取到隐藏控件的值. //点击提交按钮保存数据 $('#btn_submitUser').click(function () { var UserId = $('#UserId').val(); if (UserId == "") { $.ajax({ type: "POST", url: '/Users/Create/', data: $("#SaveUserFo

让浏览器支持 jquery ajax load 前进、后退功能

BEGIN; 一般在做 ajax load 的时候,很多人都不会考虑到需要浏览器支持前进后退功能,因为大部分人都不知道可以实现. 最近遇到这个问题,经过一小段研究,发现github已经有现成的开源工具使用,主要实现原理是利用html的锚点,即<a href="#xxx">,详情可查看https://github.com/balupton/jquery-history/tree/master 主要demo代码如下: html <ul> <li><

jQuery ajax - serialize() 方法

jQuery ajax - serialize() 方法 jQuery Ajax 参考手册实例输出序列化表单值的结果: $("button").click(function(){ $("div").text($("form").serialize()); }); 亲自试一试定义和用法 serialize() 方法通过序列化表单值,创建 URL 编码文本字符串. 您可以选择一个或多个表单元素(比如 input 及/或文本框),或者 fo