豆瓣网的jquery代码实例

      2020-09-17 01:14      编程语言
豆瓣网的jquery实例代码,效果不错,方便大家学习在文档加载完毕后将执行的方法(参见jquery文档)
一般来说文档加载的时候应该绑定所有的事件, 但是有一种情况例外.
比如 通过Ajax方法取回来的内容里面还含有动作按钮的,这时需要针对这部分功能执行绑定.
复制代码 代码如下:
//需要手动调用load_event_monitor(element);方法.
$(function(){
load_event_monitor(document);
});
//注意这里的o对象是一个html元素而非是一个jquery对象,所以在调用它的方法时应该使用$(o)函数
//把它转化为jquery对象.
Bowtech.init_forder=function(o){
vareid=$(o).attr(“id“).split(“-“)[1];
varfo=$(“#f-“+eid);
varunfo=$(“#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;
varinitSetCaret=function(){this.caretPos=document.selection.createRange().duplicate()};
this.click(initSetCaret).select(initSetCaret).keyup(initSetCaret);
},
insert_caret:function(textFeildValue){
vartextObj=this[0];
if(document.all&&textObj.createTextRange&&textObj.caretPos){
varcaretPos=textObj.caretPos;
caretPos.text=caretPos.text.charAt(caretPos.text.length-1)==”?textFeildValue+”:textFeildValue;
}elseif(textObj.setSelectionRange){
varrangeStart=textObj.selectionStart;
varrangeEnd=textObj.selectionEnd;
vartempStr1=textObj.value.substring(0,rangeStart);
vartempStr2=textObj.value.substring(rangeEnd);
textObj.value=tempStr1+textFeildValue+tempStr2;
textObj.focus();
varlen=textFeildValue.length;
textObj.setSelectionRange(rangeStart+len,rangeStart+len);
textObj.blur();
}else{
textObj.value+=textFeildValue;
}
}
})

前台要用就比较简单了,只需要这样写:

复制代码 代码如下:
<divid=”test2″class=”mod”>
<h3>
这里可以放标题
</h3>
<divclass=”jmodba_forder”id=”modb-1002″>
这里是一些主要的内容
<dl>
<dt>Helloworld</dt>
<dd>
hahaha</dd>
</dl>
这个实验在沙加的神舟本上完成
</div>
<divclass=”edit”>
<aid=”f-1002″class=”forder”href=”javascript:void(0);”>[收起]</a><aid=”unf-1002″
class=”unforder”href=”javascript:void(0);”>[展开]</a>
</div>
</div>

样式就省略了,大家可以自己写,最后发两个效果图:

收起时的样子