豆瓣网的jquery代码实例


Posted in Javascript onJune 15, 2008

在文档加载完毕后将执行的方法(参见jquery文档) 
一般来说文档加载的时候应该绑定所有的事件, 但是有一种情况例外. 
比如 通过Ajax方法取回来的内容里面还含有动作按钮的,这时需要针对这部分功能执行绑定. 

//需要手动调用 load_event_monitor(element);   方法.  
$(function() {  
 load_event_monitor(document);  
});  
//注意这里的o对象是一个html 元素而非是一个jquery对象,所以在调用它的方法时应该使用$(o)函数  
//把它转化为jquery对象.  
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;  
 }  
 }  
}) 

前台要用就比较简单了, 只需要这样写:
<div id=”test2″ class=”mod”>  
 <h3>  
 这里可以放标题  
 </h3>  
 <div class=”j modb a_forder” id=”modb-1002″>  
 这里是一些主要的内容  
 <dl>  
 <dt>Hello world</dt>  
 <dd>  
 hahaha</dd>  
 </dl>  
 这个实验在沙加的神舟本上完成  
 </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);”>[展开]</a>  
 </div>  
 </div> 

样式就省略了, 大家可以自己写, 最后发两个效果图:
豆瓣网的jquery代码实例
收起时的样子
豆瓣网的jquery代码实例
Javascript 相关文章推荐
WebGame《逆转裁判》完整版 代码下载(1月24日更新)
Jan 29 Javascript
extjs form textfield的隐藏方法
Dec 29 Javascript
jquery学习笔记二 实现可编辑的表格
Apr 09 Javascript
javascript分页代码(当前页码居中)
Sep 20 Javascript
Windows 系统下安装和部署Egret的开发环境
Jul 31 Javascript
jQuery轻松实现表格的隔行变色和点击行变色的实例代码
May 09 Javascript
AngularJS自定义插件实现网站用户引导功能示例
Nov 07 Javascript
vue如何引入sass全局变量
Jun 28 Javascript
菊花转动的jquery加载动画效果
Aug 19 jQuery
JavaScript数组方法的错误使用例子
Sep 13 Javascript
JS数组去重的6种方法完整实例
Dec 08 Javascript
JavaScript基于数组实现的栈与队列操作示例
Dec 22 Javascript
JQuery实现自定义对话框的代码
Jun 15 #Javascript
javascript基本语法分析说明
Jun 15 #Javascript
javascript新手语法小结
Jun 15 #Javascript
JavaScript入门学习书籍推荐
Jun 12 #Javascript
asp.net和asp下ACCESS的参数化查询
Jun 11 #Javascript
json跟xml的对比分析
Jun 10 #Javascript
json 定义
Jun 10 #Javascript
You might like
Dedecms V3.1 生成HTML速度的优化办法
2007/03/18 PHP
PHP函数preg_match_all正则表达式的基本使用详细解析
2013/08/31 PHP
PHP CURL CURLOPT参数说明(curl_setopt)
2013/09/30 PHP
php中session过期时间设置及session回收机制介绍
2014/05/05 PHP
php检索或者复制远程文件的方法
2015/03/13 PHP
PHP的pcntl多进程用法实例
2015/03/19 PHP
HTML中事件触发列表与解说
2007/07/09 Javascript
javascript 页面划词搜索JS
2009/09/28 Javascript
jquery 延迟执行实例介绍
2013/08/20 Javascript
禁用Tab键JS代码兼容Firefox和IE
2014/04/18 Javascript
javascript时间差插件分享
2016/07/18 Javascript
jQuery树形插件jquery.simpleTree.js用法分析
2016/09/05 Javascript
基于javascript实现的快速排序
2016/12/02 Javascript
javascript十六进制数字和ASCII字符之间的转换方法
2016/12/27 Javascript
关于vue面试题汇总
2018/03/20 Javascript
解决vue 按钮多次点击重复提交数据问题
2018/05/10 Javascript
浅谈Webpack下多环境配置的思路
2018/06/27 Javascript
vue项目中实现图片预览的公用组件功能
2018/10/26 Javascript
vuex如何重置所有state(可定制)
2019/01/17 Javascript
js模拟实现烟花特效
2020/03/10 Javascript
[01:04]DOTA2上海特锦赛现场采访 FreeAgain遭众解说围攻
2016/03/25 DOTA
python模拟登录百度贴吧(百度贴吧登录)实例
2013/12/18 Python
python通过ffmgep从视频中抽帧的方法
2018/12/05 Python
python开根号实例讲解
2020/08/30 Python
英国时尚高尔夫服装购物网站:Trendy Golf
2020/01/10 全球购物
优秀毕业生自我鉴定
2014/02/11 职场文书
青年文明号创建承诺
2014/03/31 职场文书
村级环境卫生整治方案
2014/05/04 职场文书
国际经济贸易专业自荐信
2014/06/13 职场文书
党性教育心得体会
2014/09/03 职场文书
护理实习生带教计划
2015/01/16 职场文书
刑事附带民事上诉状
2015/05/23 职场文书
未婚证明范本
2015/06/15 职场文书
CSS3通过var()和calc()函数实现动画特效
2021/03/30 HTML / CSS
python文件名批量重命名脚本实例代码
2021/04/22 Python
分析mysql中一条SQL查询语句是如何执行的
2021/06/21 MySQL