Heim > Web-Frontend > js-Tutorial > 豆瓣网的jquery代码实例_jquery

豆瓣网的jquery代码实例_jquery

WBOY
Freigeben: 2016-05-16 19:03:49
Original
1094 Leute haben es durchsucht

在文档加载完毕后将执行的方法(参见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; 
 } 
 } 
}) 

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

复制代码 代码如下:

 
 

 
 这里可以放标题 
 

 
 
 
 这里是一些主要的内容 
 
 
 
Hello world
 
 
 
 hahaha
 
 
 
 这个实验在沙加的神舟本上完成 
 
 
  
 
 

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

收起时的样子

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage