其實一直都知道可以在BlogJava后臺設(shè)置中添加頁首和頁腳部分的html代碼來實現(xiàn)訪問統(tǒng)計之類的效果,
今天在看JQuery的書的時候突然想到BlogJava是不是允許自己寫JavaScript代碼呢,于是就試了一下,
折騰了一個中午的成果就是,現(xiàn)在我的博客主頁實現(xiàn)了Ajax動態(tài)載入文章,
只要點擊"閱讀全文"的鏈接,就會直接在當(dāng)前頁面加載文章的全文.
歡迎點擊到我的首頁去試試效果: http://m.tkk7.com/jayslong/
加在頁腳的代碼如下:
1
<!-- 直接在首頁顯示文章 -->
2
<script type="text/javascript">
3
$(document).ready(function()
{
4
$("a:contains('閱讀全文')").click(function(e)
{
5
e.preventDefault();
6
$(e.target).hide();
7
var url = e.target.href;
8
$(e.target).next().remove();
9
$(e.target).after("<div>loading
</div>");
10
$(e.target).next().after("<div></div>");
11
$(e.target).next().next().hide();
12
$(e.target).next().next().load(url+" .post", function()
{
13
$(e.target).next().remove();
14
$(e.target).next().slideDown(5000);
15
});
16
});
17
});
18
</script>
19
<!-- 直接在首頁顯示文章 (結(jié)束) -->
另外還有一個前提是要應(yīng)用JQuery的包,我隨便找了個加載速度挺快的包, 加到頁首去了:
不知道現(xiàn)在才用到這個功能在這里是不是算out了..
歡迎大家分享有意思的可以用在Blogjava上的JS代碼哈.
2011-03-28 22:01 編輯:
在第13行代碼的前面加了一句
$("div a[href=#Post]").attr("href",url+"#Post");
解決了原來日志頁面是相對鏈接,導(dǎo)致在首頁點擊回復(fù)按鈕無效的問題.
另外為今天早些時候頁面js代碼的失效表示抱歉,昨晚在改的時候睡著了,改了一半導(dǎo)致代碼中有錯無法執(zhí)行..
posted on 2011-03-25 15:22
ApolloDeng 閱讀(2891)
評論(8) 編輯 收藏 所屬分類:
分享 、
Js/JQuery/Ajax 、
Web