简单Jquery--Ajax应用

作为一个新手,最近自己写了一个人主页,虽然性能不怎么样,但就出现的各种大的小的问题拿出来与大家分享分享。
----DanlV

描述

错误描述

自己不知道什么原因,直接使用$ajax(/.../)浏览器一直出现安全问题,即权限问题无法访问,不能读取本地文件。

解决方案

鄙人用了一个简单,也有点蠢的解决方案。方案代码:

$("#Photos12").load("photo.jsp", {index: 					Aindex},function(){
alert("1");
});

直接使用jquery.load()方法,其中第一个参数为所需调用页面地址;第二个参数为json格式的数据;第三个参数为回调函数,这个回调函数比较粗略,不管吃调用成不成功,都会执行。

此方法返回值问题

使用load()方法,会返回所调用页面所有的html代码(txt文本格式),也可以返回调用页面指定html元素以及此元素的内容(页面片段)。

$("#result").load("ajax/test.html #container");

调用页面获取传递参数

对于参数的获取本人在敲代码的过程中,是个大难题,不知道是不是浏览器的问题,还是tomcat服务器的问题,一直获取参数失败,但是F12 -浏览器查看传递的json格式数据的确是传递过去了,没有问题。在调用页面中,使用java代码段获取传递值,代码实例:

String Index=request.getParameter("index");

通过java的request。getParameter()函数来获取参数。这是方法之一,而且屡试不爽,虽然麻烦了一点,还是很有实际用处的。

jQuery ajax - load() 方法

写下正牌网站对jquery.load方法的详细阐述

参考w3cschool

实例

使用 AJAX 请求来改变 div 元素的文本:

$("button").click(function(){
$("div").load('demo_ajax_load.txt');
});

定义和用法

load() 方法通过 AJAX 请求从服务器加载数据,并把返回的数据放置到指定的元素中。

TIPS:还存在一个名为 load 的 jQuery 事件方法。调用哪个,取决于参数。

语法

load(url,data,function(response,status,xhr))
参数 描述
url 规定要将请求发送到哪个 URL。
data 可选。规定连同请求发送到服务器的数据。
function(response,status,xhr)

可选。规定当请求完成时运行的函数。

额外的参数:

  • response - 包含来自请求的结果数据
  • status - 包含请求的状态("success", "notmodified", "error", "timeout" 或 "parsererror")
  • xhr - 包含 XMLHttpRequest 对象

详细说明

该方法是最简单的从服务器获取数据的方法。它几乎与 $.get(url, data, success) 等价,不同的是它不是全局函数,并且它拥有隐式的回调函数。当侦测到成功的响应时(比如,当 textStatus 为 "success" 或 "notmodified" 时),.load() 将匹配元素的 HTML 内容设置为返回的数据。这意味着该方法的大多数使用会非常简单:

$("#result").load("ajax/test.html");
如果提供回调函数,则会在执行 post-processing 之后执行该函数:
$("#result").load("ajax/test.html", function() {
alert("Load was performed.");
});

上面的两个例子中,如果当前文档不包含 "result" ID,则不会执行 .load() 方法。

如果提供的数据是对象,则使用 POST 方法;否则使用 GET 方法。

加载页面片段.load() 方法,与 $.get() 不同,允许我们规定要插入的远程文档的某个部分。这一点是通过 url 参数的特殊语法实现的。如果该字符串中包含一个或多个空格,紧接第一个空格的字符串则是决定所加载内容的 jQuery 选择器。

我们可以修改上面的例子,这样就可以使用所获得文档的某部分:

$("#result").load("ajax/test.html #container");

如果执行该方法,则会取回 ajax/test.html 的内容,不过然后,jQuery 会解析被返回的文档,来查找带有容器 ID 的元素。该元素,连同其内容,会被插入带有结果 ID 的元素中,所取回文档的其余部分会被丢弃。

jQuery 使用浏览器的 .innerHTML 属性来解析被取回的文档,并把它插入当前文档。在此过程中,浏览器常会从文档中过滤掉元素,比如 , 或 元素。结果是,由 .load() 取回的元素可能与由浏览器直接取回的文档不完全相同。

注释:由于浏览器安全方面的限制,大多数 "Ajax" 请求遵守同源策略;请求无法从不同的域、子域或协议成功地取回数据。

更多实例

例子 1

加载 feeds.html 文件内容:

$("#feeds").load("feeds.html");

例子 2

与上面的实例类似,但是以 POST 形式发送附加参数并在成功时显示信息:

$("#feeds").load("feeds.php", {limit: 25}, function(){
alert("The last 25 entries in the feed have been loaded");
});

例子 3

加载文章侧边栏导航部分至一个无序列表:

HTML 代码:

<b>jQuery Links:</b>
<ul id="links"></ul>
jQuery 代码:
$("#links").load("/Main_Page #p-Getting-Started li");

jquery.load问题的更多相关文章

  1. jQuery load()方法用法集锦!

    调用load方法的完整格式是:DE>load( url, [data], [callback] ),其中DE> DE>urlDE>:是指要导入文件的地址. DE>data ...

  2. 在 ASP.NET 中使用 jQuery.load() 方法

    今天就让我们看看在 ASP.NET 中使用 jQuery.load() 方法来调用 ASP.NET 的方法,实现无刷新的加载数据. 使用 jQuery 的朋友应该知道可以使用 jQuery.load( ...

  3. 关于IE8中使用Jquery load方法无法正常加载页面

    最近发现,在IE8中使用Jquery load方法时无法正常加载页面,页面显示空白,没有加载.调试发现,页面多了一个</div>标签,但在FF和CH下表现正常.希望能给遇到同样问题的码农有 ...

  4. 使用Jquery.load()方法,出现-此页的状态信息无效,可能已损坏。[转]

    今天遇到此页的状态信息无效,可能已损坏,在以下页面找到解决办法,特记录下来: 转自:http://www.cnblogs.com/liuwenlong/archive/2011/05/09/20410 ...

  5. jquery load加载页面内ajax返回的div不能响应页面js的问题的解决方案

    1. 前言 由于项目需要,需要load一个页面并保持ajax返回的div能响应其页面内的JS的click事件.这个不是 解决用jquery load加载页面到div时,不执行页面js的问题 这类问题, ...

  6. jquery load()函数和window.onload事件

    我想用jquery load()一个饼状图页面, 但是load不出来 代码如下: 后来百度了一下,解决办法如下: window.onload事件只有在文档载入的时候才会执行的,你载入子页面不会触发这个 ...

  7. IE8中jQuery.load()加载页面不显示的原因

    一.jQuery.load() jQuery.load(url,[data],[callback])通过Ajax异步请求加载服务器中的数据,并把数据放到指定元素中. url :请求服务器的地址 dat ...

  8. jQuery .load() 里面的代码不能执行

    今天在写代码的时候发现.on('load')绑定的事件没用.代码如下: debugger断点没进来,说明函数压根没进来. 后面在stackoverflow上找到了解决方法,方法如下图: 这样写,如果提 ...

  9. jQuery load和unload函数使用

    实例 当用户点击链接离开本页时,弹出一个消息框: $(window).unload(function(){ alert("Goodbye!"); }); 亲自试一试 定义和用法 当 ...

随机推荐

  1. laravel实现多数据库连接配置

    只需三步,便可实现. 第一步,在.env文件中配置 DB_HOST=localhost DB_DATABASE=test DB_USERNAME=root DB_PASSWORD=root DB_HO ...

  2. React学习小结(三)

    一.React数据的传输 1.属性和状态是react中数据传递的载体 2.属性是声明以后不允许被修改的东西 3.属性只能在组件初始化的时候声明并传入组件内部,并且在组件内部通过this.props获取 ...

  3. CORS协议与Spring注解的冲突

    众所周知,HTML5的CORS协议,支持各种request method,远胜于仅支持get方式的JSONP. 但今天,我用CORS协议,却一直不成功. 跨域异常,如图 POST http://10. ...

  4. C/C++遍历目录下的所有文件(Windows篇,超详细)

    注: 1. 本文讨论的是怎么用Windows API遍历目录下的所有文件.除Windows API,还有一种Windows/Linux通用的方式,使用<io.h>. 2. 本文部分翻译自M ...

  5. GPU编程--宏观理解篇(1)

    GPU编程与CPU编程最大的不同可以概括为以下两点: "The same program is executed on many data elements in parallel" ...

  6. Python常用的第三方库

    最近学习python 做些数据挖掘相关的练习,涉及到很多第三方的库,所以做一总结. Setuptools 可以让程序员更方便的创建和发布 Python 包,特别是那些对其它包具有依赖性的状况. 我特别 ...

  7. File字节流

    1.    File f = new File("文件路径")      注意:相对路径:非web项目的相对都是以项目为起点.(src/a/txt(建议)      绝对路径:f: ...

  8. java之内部类

    最近学了java,对内部类有一点拙见,现在分享一下 所谓内部类(nested classes),即:面向对象程序设计中,可以在一个类的内部定义另一个类. 内部类不是很好理解,但说白了其实也就是一个类中 ...

  9. cookie笔记(一)

    1.浏览器存储信息的一个工具 2.容量有限,每个域名一般50个.详情 3.形式:键=值: 4.获取:document.cookie; 5.设置:document.cookie="uid=we ...

  10. ZooKeeper数据模型

    ZooKeeper有一个分层的命名空间,类似分布式文件系统.它们唯一的区别就在于在命名空间中每个节点可以有数据关联作为它们的子节点.这就像有一个文件系统允许文件也作为文件目录.节点路径通常表示为规范的 ...