标签为“JavaScript”的存档

使用 jQuery 实现 window.parent.document.getElementById().innerHTML

因为先前遇到的问题,所以我考虑采用 IFRAME 来隔离不同的脚本,从而实现我需要的效果。 在框架中,我用 JavaScript 获取 JSON 数据,组织成 HTML 代码,最后将其填充至上层文档的一个元素中。按照一般的写法,我们需要用到类似如下的语句: window.parent.document.getElementById("myEle").innerHTML = html; 使用 jQuery ,写法如下: $("#myEle", window.parent.document).html(html); 即指明了是在 window.parent.document 中查找 id=myEle 的元素。 随着前面的问题的解决(其实是对 jQuery 的了解不够),现在两种方案都可以实现我需要的效果了。 另外还有一种实现方式,代码如下: parent.$("#myEle").html(html); 这种方法要求父文档也要调用 jQuery 。 演示:使用 jQuery 实现 window.parent.document.getElementById().innerHTML

阅读全文

jQuery 导致 UCenter Home 的脚本出错

此问题已经解决,请参考更新部分。 我使用 UCenter Home 搭建了一个网站,并且按照《利用 jQuery 显示来自 flickr feed 的相片》中的方法,在个人主页栏目下,展示我最近更新至 Flickr 的相片。相片的展示没有问题,但是伴随而来的却是 UCenter Home 的某些功能无法使用,例如留言。 粗略地看了一下错误提示,推测产生错误的原因是 $() 函数。 在 jQuery 中,$() 是它的核心函数,用以查找匹配元素,因为参数的不同,使得它的功能非常强大。但是在 UCenter Home 中,$() 函数只是简单的简化了 document.getElementById() 这个方法。在 jQuery 中 $(“div”) 匹配的是所有的 DIV 元素,但是在 UCenter Home 中,匹配的是 id=”div” 的元素。这种差异直接导致引入 jQuery.js 后,UCenter Home 中的脚本多处出现对象未定义——因为方法被覆盖掉了,得到的已经不是一个元素,而是一类元素的集合,或者根本就没有匹配的元素。 在这种情况下,改写 jQuery.js 或者 UCenter Home 中的脚本,都是不太可行的,同时 UCenter Home 中好像也没有对于 JSON 数据格式的处理函数。我也只能寻求其它的方法。不过由此,我也想到一个问题:UCenter Home [...]

阅读全文

利用 jQuery 显示来自 flickr feed 的相片

因为一个小小的制作,需要显示来自于 Flickr 上的最新更新的相片信息,正如很多人的博客的边栏中显示的那样。这里,我只需要利用 Flickr 提供的 JSON 格式的 feed 数据便可。开始之前,我们需要了解下面的内容: JSON – JavaScript Object Notation jQuery 的 Ajax Requests Flickr Services 的 JSON Response Format 注意到 Flickr 的文档中提到的回调函数(Callback Function),我们可以使用默认的回调函数,也可以通过将 nojsoncallback 设置为 1 ,从而去掉默认的回调函数。 在 jQuery.getJSON() 请求中,我们也可以指定回调函数。 如下代码,可以让我们获取到 JSON 数据: $.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?id=42657763@N08&lang=zh-cn&format=json&nojsoncallback=1";, function(data) {}); 这里使用 nojsoncallback 参数去掉了默认的回调函数,如果要指定回调函数,使用如下语法: $.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?id=42657763@N08&lang=zh-cn&format=json&jsoncallback=?", function(data) {}); 注意不要遗漏 jsoncallback=? 中的“?”符号。 上面调用的 feed ,返回的是公开的相片,考察 JSON 的格式,我们通过下面的代码来生成相片显示的 [...]

阅读全文