这里是生活记录站丨技术站>>



jQuery(点击链接文字后替换文字

Posted by MOPVHS on 2010/04/03 Leave a comment Go to comments




本文涉及的代码来自小邪的菠萝阁中的JQUERY点击链接文字后替换文字

MOPVHS：我刚刚半入门jQuery，要我详细分析代码肯定露馅…所以，实现步骤如下：

嗯嗯，第一步还是先载入JQuery库。

然后一下是js代码：

jQuery(document).ready(function($){ 

$('a').click(function(){
	$(this).text('载入中 ...');
	});

});

这样就实现了博客上所有的链接都加上自动替换的效果。

不过，随之而来的杯具是：

替换后不会换回来…

如果不明真相的围观群众点击的是带 Target=”_blank”的链接，从新的窗口打开…

那么…后果…你懂的…

现在，免费提供5分钟思考时间，以便各位看官自行领悟解决方法…

Nice…接下来让我们看看小邪的思路：

> 那么下面要实现的就是在 1.8 秒钟以后自动将链接文字替换回来。
> 一般网页的载入时间是 1.3 秒钟，然后假设新窗口打开之后立即切换回来，就总共算 1.8 秒。

进阶版代码如下:

jQuery(document).ready(function($){ 

$('a').click(function(){
	myloadoriginal = this.text;
	$(this).text('载入中 ...');
	var myload = this;
	setTimeout(function() { $(myload).text(myloadoriginal); }, 1800);
});

});

此代码一出，全站链接无一幸免，可谓居家旅行，XX越货必备…

记录完毕，再次感谢小邪为我们提供这么好的创意。

参考文章：http://leeiio.me/jquery-changes-link-text/







jQuery , , ,

17 Comments.

  1. Jessy

    Firefox 3.6.15 Firefox 3.6.15 Windows 7 Windows 7

    2011/03/18 4:48 上午 on 1

    试试你的留言功能

    回复
  2. 静夜燃香

    Firefox 3.6.8 Firefox 3.6.8 Windows 7 Windows 7

    2010/08/14 11:52 下午 on 1

    有用有用~~~不过我直接把图片链接的效果踢掉了~~~~反正autoslide会出loading的效果~~~~

    回复
  3. 流年

    Firefox 3.6.8 Firefox 3.6.8 Windows XP Windows XP

    2010/08/02 11:31 下午 on 1

    其实我想问的是如何解决Opera的问题，嗯，问题描述见这里http://liunian.info/add-loading-when-click-hyperlink.html

    回复
  4. pazz7ven

    Google Chrome 4.1.249.1064 Google Chrome 4.1.249.1064 Windows XP Windows XP

    2010/05/14 2:52 下午 on 1

    不错 我去试试

    还有请教下 标签页是如何显示我的网名的？pazz7ven 你正在阅读的是：。。。。。
    怎么实现的

    回复
  5. thinknew

    Internet Explorer 6.0 Internet Explorer 6.0 Windows XP Windows XP

    2010/04/13 8:34 下午 on 1

    我用的是IE，哈哈，该效果直接屏蔽~

    回复
  6. 集趣

    Google Chrome 5.0.360.4 Google Chrome 5.0.360.4 Windows XP Windows XP

    2010/04/13 7:15 下午 on 1

    加上这个特效，感觉有些浪费时间哦！

    回复
  7. www.1hzb.cn

    Firefox 3.5.5 Firefox 3.5.5 Windows XP Windows XP

    2010/04/04 12:29 上午 on 1

    :wink: 这个博客有点酷··· :grin:

    回复
  8. MOPVHS

    Google Chrome 4.1.249.1042 Google Chrome 4.1.249.1042 Windows XP Windows XP

    2010/04/03 9:26 下午 on 1

    等一下….我突然发现点击图片，图片被替换成文字…

    然后… :cry: 我的图片呢~~~

    又一个悲剧…有两个选择:1.自己写代码解决。2.求助小邪。

    嘿嘿，当然选择前者的了…

    回复

Leave a Reply


[ Ctrl + Enter ] 订阅评论Feed