z-blogSyntaxHighlighter长代码无法换行解决办法(jquery)
2023-06-13 09:15:30 时间
由于我的博客主要是代码分享,很多贴的代码,都很长。很多时候我都是手动给他换行。
但是今天实在是受不了。从网上找个办法解决一下。
1、css修改:
在文件夹:\zb_system\ADMIN\ueditor\third-party\SyntaxHighlighter
在文件shCoreDefault.pack.css添加css:
body.syntaxhighlighter.line{ white-space:pre-wrap!important;}.syntaxhighlighter{width:100%!important;margin:.3em0.3em0!important;position:relative!important;overflow:auto!important;background-color:#f5f5f5!important;border:1pxsolid#ccc!important;word-break:break-all;
2、Jquery代码:
$(function(){ //Linewrapback varshLineWrap=function(){ $(".syntaxhighlighter").each(function(){ //Fetch var$sh=$(this), $gutter=$sh.find("td.gutter"), $code=$sh.find("td.code") ; //Cyclethroughlines $gutter.children(".line").each(function(i){ //Fetch var$gutterLine=$(this), $codeLine=$code.find(".line:nth-child("+(i+1)+")") ; //alert($gutterLine); //Fetchheight varheight=$codeLine.height()||0; if(!height){ height="auto"; } else{ height=height+="px"; //alert(height); } //Copyheightover $gutterLine.attr("<SPANstyle="WIDTH:auto;HEIGHT:auto;float:none"id=0_nwp><Astyle="TEXT-DECORATION:none"id=0_nwlhref="http://cpro.baidu.com/cpro/ui/uijs.php?rs=1&u=http%3A%2F%2Fwww%2Esuchso%2Ecom%2Fprojecteactual%2Fz%2Dblog%2Djquery%2DSyntaxHighlighter%2Dlongcode%2Ehtml&p=baidu&c=news&n=10&t=tpclicked3_hc&q=95053049_cpr&k=style&k0=%CE%C4%BC%FE%BC%D0&kdi0=32&k1=style&kdi1=1&k2=%B2%A9%BF%CD&kdi2=1&sid=77860fedb9413425&ch=0&tu=u1702844&jk=e7459084404b7b2f&cf=29&fv=15&stid=9&urlid=0&luki=2&seller_id=1&di=128"target=_blankmpid="0"><SPANstyle="WIDTH:auto;FLOAT:none;HEIGHT:auto;COLOR:#0000ff;FONT-SIZE:16px">style</SPAN></A></SPAN>","height:"+height+"!important");//fixbyEdi,forJQuery1.7+underFirefox15.0 console.debug($gutterLine.height(),height,$gutterLine.text(),$codeLine); }); }); }; //Linewrapbackwhensyntaxhighlighterhasdoneit"sstuff varshLineWrapWhenReady=function(){ if($(".syntaxhighlighter").length===0){ setTimeout(shLineWrapWhenReady,10); } else{ shLineWrap(); } }; //Fire shLineWrapWhenReady();});
上面的代码就是属于长代码。大家看看是不是都换行了??
现在,行号的高度就能和代码的高度保持一致了。
相关文章
- jQuery判断页面元素是否存在的代码
- jQuery事件队列调整方法
- jquery最简单的属性菜单
- jQuery添加/移除CSS类实现代码
- jquery打开窗口返回值实现代码
- Jquery滑入滑出效果实现代码
- jQuery的实现原理的模拟代码-3事件处理
- 基于Jquery的动态添加控件并取值的实现代码
- jquery中实现简单的tabs插件功能的代码
- 检测jQuery.js是否已加载的判断代码
- jquery中获取select选中值的代码
- jQuery动态添加的元素绑定事件处理函数代码
- jquery实现的带缩略图的焦点图片切换(自动播放/响应鼠标动作)
- Jquery图片滚动与幻灯片的实例代码
- jquery模板的应用示例
- jquery.autocomplete修改实现键盘上下键自动填充示例
- jquery简单实现滚动条下拉DIV固定在头部不动
- jquery垂直公告滚动实现代码
- jquery创建表格(自动增加表格)代码分享
- JS,Jquery获取select,dropdownlist,checkbox下拉列表框的值(示例代码)
- asp.net中利用Jquery+Ajax+Json实现无刷新分页的实例代码
- jquery实现人性化的有选择性禁用鼠标右键
- javascript和jquery实现设置和移除文本框默认值效果代码