jQuery的历史插件

历史导航和刷新问题是使用Ajax中的一个软肋,但可以用JavaScript来弥补这个问题。jquery history pluginjquery的 一款历史刷新插件,但它有时候会出现一些Bug,如回上一页时会不流畅。

而今天要推荐的的插件是jQuery Address,它是另一款jquery插件,可以完美地实现历史导航与刷新问题,另外还有针对Flash导航的SWFAddress。你可以查看它的文档API, 来详细了解它的用法。

jQuery Address使用很简单,最基础的使用方法如下:

$.address.change(function(event) {
// 根据event.value的值执行相应的命令
// $('#content').load(event.value + '.xml');
});
$('a').click(function() {
// 下面这条命令触发$.address.change事件
$.address.value($(this).attr('href'));
});

此插件也提供了一个可以直接使用的方法:

$('a').address();

上面这条命令也可以增加一个函数,来处理链接的值,如下:

$('a').address(function() {
return $(this).attr('href').replace(/^#/, '');
});

默认下,此插件会自动给属性rel值为以下格式的链接增加功能:

<a href="/deep-link" rel="address:/deep-link">Deep link</a>

下面是jQuery Address的API参考文档:

Events(事件)

$.address.change(fn)

返回:jQuery Address对象

当地址改变时会执行所绑定的函数(fn),此函数会接收一个事件对象做为参数,该事件对象包含有以下属 性:value,path,pathNames,parameterNames,parameters和queryString。

$.address.init(fn)

返回:jQuery Address对象

当插件初始化时会执行所绑定的函数(fn),此函数只能执行一次,它会接收一个事件对象做为参数,该事件对象包含有以下属 性:value,path,pathNames,parameterNames,parameters和queryString。

$.address.internalChange(fn)

返回:jQuery Address对象

当改变地址的行为来源于页面时,如点击页面中的一个链接,会执行所绑定的函数(fn),此函数会接收一个事件对象做为参数,该事件对象包含有以下属 性:value,path,pathNames,parameterNames,parameters和queryString。

$.address.externalChange(fn)

返回:jQuery Address对象

当改变地址的行为来源于浏览器时,如点击浏览器的前进与后退按钮,会执行所绑定的函数(fn),此函数会接收一个事件对象做为参数,该事件对象包含 有以下属性:value,path,pathNames,parameterNames,parameters和queryString。

Functions(函数)

address(fn)

返回:jQuery对象

为DOM元素增加本插件的功能,同时会取消DOM元素的默认行为。支持链接和表单,可以根据传入的参数值进行自定义。

这篇文章只翻译了jQuery AddressEvents(事 件)Functions(函数)部分,Methods(方法)部分请查看《jQuery Address API文档——Methods(方法)》一文。

Tag(s): ,
  • QQshuqian
  • Del.icio.us
  • Baidu
  • Google
  • Fanfou
  • FriendFeed
4 Comments Contributed by Visitors
  1. rebuttonFirm | 21:27@10-05-14 1 Firm

    是针对WordPress的不

  2. rebuttonzwwooooo | 23:21@10-05-21 2 zwwooooo

    jQ效果很赞,有没有直接用的?兼容性又好的。。。

  3. rebuttonedikud | 14:07@10-05-22 3 edikud

    @Firm 全站使用Ajax时才会用到,要是用到WordPress上我还没有这个能力啊!

  4. rebuttonedikud | 14:12@10-05-22 4 edikud

    @zwwooooo 你是指这个jQuery的历史插件吧,它的兼容性是不错的,直接用就可以了,全站使用Ajax时效果才会很赞!

Leave Comments Here...

:smile: :grin: :sad: :eek: :shock: :???: :cool: :lol: :mad: :razz: :oops: :cry: :evil: :twisted: :wink: :?: :idea: :neutral:

必填

必填&保密

随您

Ctrl+Enter

  • 已部署"白忙活" Anti-Spam 系统,猪肉 Spammer 请注意查看源代码链接处。
  • 本站不会泄露您的邮件地址,敬请放心。
  • 支持常用 HTML 代码调用,插入 PHP 代码需注意:< = &lt;> = &gt;
  • 仅当某人针对您的评论做出回应时,您才会收到由本站发出的通知信件。
  • 如您希望以相同方式通知某位网友,请点击 Reply 按钮,或自行输入 @对方名字:
  • 鼠标移至评论列表中的 @someone: 区域即可自动显示 someone 的评论内容。

您直接访问了本站! 嘿嘿