豆瓣網(wǎng)的jquery代碼實(shí)例
更新時(shí)間:2008年06月15日 20:01:45 作者:
豆瓣網(wǎng)的jquery實(shí)例代碼,效果不錯(cuò),方便大家學(xué)習(xí)
在文檔加載完畢后將執(zhí)行的方法(參見(jiàn)jquery文檔)
一般來(lái)說(shuō)文檔加載的時(shí)候應(yīng)該綁定所有的事件, 但是有一種情況例外.
比如 通過(guò)Ajax方法取回來(lái)的內(nèi)容里面還含有動(dòng)作按鈕的,這時(shí)需要針對(duì)這部分功能執(zhí)行綁定.
//需要手動(dòng)調(diào)用 load_event_monitor(element); 方法.
$(function() {
load_event_monitor(document);
});
//注意這里的o對(duì)象是一個(gè)html 元素而非是一個(gè)jquery對(duì)象,所以在調(diào)用它的方法時(shí)應(yīng)該使用$(o)函數(shù)
//把它轉(zhuǎn)化為jquery對(duì)象.
Bowtech.init_forder = function(o) {
var eid = $(o).attr(“id“).split(“-“)[1];
var fo = $(“#f-“+eid);
var unfo = $(“#unf-“+eid);
fo.click(function() {
$(o).hide();
unfo.show();
fo.hide();
});
unfo.click(function() {
$(o).show();
fo.show();
unfo.hide();
});
}
jQuery.fn.extend({
set_caret: function(){
if(!$.browser.msie) return;
var initSetCaret = function(){this.caretPos = document.selection.createRange().duplicate()};
this.click(initSetCaret).select(initSetCaret).keyup(initSetCaret);
},
insert_caret:function(textFeildValue){
var textObj = this[0];
if(document.all && textObj.createTextRange && textObj.caretPos){
var caretPos=textObj.caretPos;
caretPos.text = caretPos.text.charAt(caretPos.text.length-1) == ” ? textFeildValue+” : textFeildValue;
} else if(textObj.setSelectionRange){
var rangeStart=textObj.selectionStart;
var rangeEnd=textObj.selectionEnd;
var tempStr1=textObj.value.substring(0,rangeStart);
var tempStr2=textObj.value.substring(rangeEnd);
textObj.value=tempStr1+textFeildValue+tempStr2;
textObj.focus();
var len=textFeildValue.length;
textObj.setSelectionRange(rangeStart+len,rangeStart+len);
textObj.blur();
} else {
textObj.value+=textFeildValue;
}
}
})
前臺(tái)要用就比較簡(jiǎn)單了, 只需要這樣寫:
<div id=”test2″ class=”mod”>
<h3>
這里可以放標(biāo)題
</h3>
<div class=”j modb a_forder” id=”modb-1002″>
這里是一些主要的內(nèi)容
<dl>
<dt>Hello world</dt>
<dd>
hahaha</dd>
</dl>
這個(gè)實(shí)驗(yàn)在沙加的神舟本上完成
</div>
<div class=”edit”>
<a id=”f-1002″ class=”forder” href=”javascript:void(0);”>[收起]</a> <a id=”unf-1002″
class=”unforder” href=”javascript:void(0);”>[展開(kāi)]</a>
</div>
</div>
樣式就省略了, 大家可以自己寫, 最后發(fā)兩個(gè)效果圖:

收起時(shí)的樣子

一般來(lái)說(shuō)文檔加載的時(shí)候應(yīng)該綁定所有的事件, 但是有一種情況例外.
比如 通過(guò)Ajax方法取回來(lái)的內(nèi)容里面還含有動(dòng)作按鈕的,這時(shí)需要針對(duì)這部分功能執(zhí)行綁定.
復(fù)制代碼 代碼如下:
//需要手動(dòng)調(diào)用 load_event_monitor(element); 方法.
$(function() {
load_event_monitor(document);
});
//注意這里的o對(duì)象是一個(gè)html 元素而非是一個(gè)jquery對(duì)象,所以在調(diào)用它的方法時(shí)應(yīng)該使用$(o)函數(shù)
//把它轉(zhuǎn)化為jquery對(duì)象.
Bowtech.init_forder = function(o) {
var eid = $(o).attr(“id“).split(“-“)[1];
var fo = $(“#f-“+eid);
var unfo = $(“#unf-“+eid);
fo.click(function() {
$(o).hide();
unfo.show();
fo.hide();
});
unfo.click(function() {
$(o).show();
fo.show();
unfo.hide();
});
}
jQuery.fn.extend({
set_caret: function(){
if(!$.browser.msie) return;
var initSetCaret = function(){this.caretPos = document.selection.createRange().duplicate()};
this.click(initSetCaret).select(initSetCaret).keyup(initSetCaret);
},
insert_caret:function(textFeildValue){
var textObj = this[0];
if(document.all && textObj.createTextRange && textObj.caretPos){
var caretPos=textObj.caretPos;
caretPos.text = caretPos.text.charAt(caretPos.text.length-1) == ” ? textFeildValue+” : textFeildValue;
} else if(textObj.setSelectionRange){
var rangeStart=textObj.selectionStart;
var rangeEnd=textObj.selectionEnd;
var tempStr1=textObj.value.substring(0,rangeStart);
var tempStr2=textObj.value.substring(rangeEnd);
textObj.value=tempStr1+textFeildValue+tempStr2;
textObj.focus();
var len=textFeildValue.length;
textObj.setSelectionRange(rangeStart+len,rangeStart+len);
textObj.blur();
} else {
textObj.value+=textFeildValue;
}
}
})
前臺(tái)要用就比較簡(jiǎn)單了, 只需要這樣寫:
復(fù)制代碼 代碼如下:
<div id=”test2″ class=”mod”>
<h3>
這里可以放標(biāo)題
</h3>
<div class=”j modb a_forder” id=”modb-1002″>
這里是一些主要的內(nèi)容
<dl>
<dt>Hello world</dt>
<dd>
hahaha</dd>
</dl>
這個(gè)實(shí)驗(yàn)在沙加的神舟本上完成
</div>
<div class=”edit”>
<a id=”f-1002″ class=”forder” href=”javascript:void(0);”>[收起]</a> <a id=”unf-1002″
class=”unforder” href=”javascript:void(0);”>[展開(kāi)]</a>
</div>
</div>
樣式就省略了, 大家可以自己寫, 最后發(fā)兩個(gè)效果圖:

收起時(shí)的樣子

相關(guān)文章
jQuery實(shí)現(xiàn)拖動(dòng)剪裁圖片作為頭像
本文主要介紹了jQuery實(shí)現(xiàn)拖動(dòng)剪裁圖片作為頭像的具體實(shí)例方法,具有很好的參考價(jià)值,下面跟著小編一起來(lái)看下吧2016-12-12基于jquery的button默認(rèn)enter事件(回車事件)。
這里我介紹一下,button按鈕默認(rèn)回車(enter)事件。如果大家可以用submit,就不用看以下代碼,因?yàn)閟ubmit可以直接默認(rèn)回車事件(enter)2011-05-05分享20個(gè)提升網(wǎng)站界面體驗(yàn)的jQuery插件
今天為大家整理20個(gè)提升網(wǎng)站界面的體驗(yàn)的jQuery插件,這些都是比較“新款”的代碼,喜歡的請(qǐng)用到你的網(wǎng)站項(xiàng)目上吧2014-12-12jQuery實(shí)現(xiàn)的Div窗口震動(dòng)特效
這篇文章主要介紹了jQuery實(shí)現(xiàn)的Div窗口震動(dòng)特效 ,需要的朋友可以參考下2014-06-06jquery 鍵盤事件 keypress() keydown() keyup()用法總結(jié)
在本篇文章里小編給各位整理的是關(guān)于jquery 鍵盤事件 keypress() keydown() keyup()用法總結(jié)以及相關(guān)實(shí)例,需要的朋友們學(xué)習(xí)下。2019-10-10jquery做的一個(gè)簡(jiǎn)單的屏幕鎖定提示框
這篇文章主要介紹了使用jquery做的一個(gè)簡(jiǎn)單的屏幕鎖定提示框,需要的朋友可以參考下2014-03-03