z-blog SyntaxHighlighter 长代码无法换行解决办法(jquery)


Posted in Javascript onNovember 16, 2014

由于我的博客主要是代码分享,很多贴的代码,都很长。很多时候我都是手动给他换行。

但是今天实在是受不了。从网上找个办法解决一下。

1、css修改:

z-blog SyntaxHighlighter 长代码无法换行解决办法(jquery)

在文件夹:\zb_system\ADMIN\ueditor\third-party\SyntaxHighlighter

在文件shCoreDefault.pack.css添加css:

body .syntaxhighlighter .line{     white-space: pre-wrap !important;} .syntaxhighlighter{width:100%!important;margin:.3em 0 .3em 0!important;position:relative!important;overflow:auto!important;background-color:#f5f5f5!important;border:1px solid #ccc!important;word-break:break-all;

2、Jquery代码:

$(function () { 
  // Line wrap back 
  var shLineWrap = function () { 
    $('.syntaxhighlighter').each(function () { 
      // Fetch 
      var $sh = $(this), 
        $gutter = $sh.find('td.gutter'), 
        $code = $sh.find('td.code') 
        ; 
      // Cycle through lines 
      $gutter.children('.line').each(function (i) { 
        // Fetch 
        var $gutterLine = $(this), 
          $codeLine = $code.find('.line:nth-child(' + (i + 1) + ')') 
          ; 
        //alert($gutterLine); 
        // Fetch height 
        var height = $codeLine.height() || 0; 
        if (!height) { 
          height = 'auto'; 
        } 
        else { 
          height = height += 'px'; 
          //alert(height); 
        } 
        // Copy height over 
        $gutterLine.attr('<SPAN style="WIDTH: auto; HEIGHT: auto; float: none" id=0_nwp><A style="TEXT-DECORATION: none" id=0_nwl href="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=_blank mpid="0"><SPAN style="WIDTH: auto; FLOAT: none; HEIGHT: auto; COLOR: #0000ff; FONT-SIZE: 16px">style</SPAN></A></SPAN>', 'height: ' + height + ' !important'); // fix by Edi, for JQuery 1.7+ under Firefox 15.0 
        console.debug($gutterLine.height(), height, $gutterLine.text(), $codeLine); 
      }); 
    }); 
  }; 
  // Line wrap back when syntax highlighter has done it's stuff 
  var shLineWrapWhenReady = function () { 
    if ($('.syntaxhighlighter').length === 0) { 
      setTimeout(shLineWrapWhenReady, 10); 
    } 
    else { 
      shLineWrap(); 
    } 
  }; 
  // Fire 
  shLineWrapWhenReady();});

上面的代码就是属于长代码。大家看看是不是都换行了??

现在,行号的高度就能和代码的高度保持一致了。

Javascript 相关文章推荐
JavaScript使用cookie
Feb 02 Javascript
JQuery扩展插件Validate 1 基本使用方法并打包下载
Sep 05 Javascript
jQuery中(function(){})()执行顺序的理解
Mar 05 Javascript
jquery.uploadify插件在chrome浏览器频繁崩溃解决方法
Mar 01 Javascript
angular.bind使用心得
Oct 26 Javascript
vueJS简单的点击显示与隐藏的效果【实现代码】
May 03 Javascript
Vue.js事件处理器与表单控件绑定详解
Mar 20 Javascript
Angular弹出模态框的两种方式
Oct 19 Javascript
JavaScript代码执行的先后顺序问题
Oct 29 Javascript
layui表格 列自动适应大小失效的解决方法
Sep 06 Javascript
谈谈node.js中的模块系统
Sep 01 Javascript
解决vue-cli输入命令vue ui没效果的问题
Nov 17 Javascript
js构造函数、索引数组和属性的实现方式和使用
Nov 16 #Javascript
JQuery表单验证插件EasyValidator用法分析
Nov 15 #Javascript
不到30行JS代码实现Excel表格的方法
Nov 15 #Javascript
Node.js中HTTP模块与事件模块详解
Nov 14 #Javascript
jquery中append()与appendto()用法分析
Nov 14 #Javascript
jQuery 插件开发指南
Nov 14 #Javascript
使用JavaScript和C#中获得referer
Nov 14 #Javascript
You might like
2019年中国咖啡业现状与发展趋势
2021/03/04 咖啡文化
php设计模式 Visitor 访问者模式
2011/06/28 PHP
Memcached常用命令以及使用说明详解
2013/06/27 PHP
smarty自定义函数htmlcheckboxes用法实例
2015/01/22 PHP
简单实现php上传文件功能
2017/09/21 PHP
Javascript与vbscript数据共享
2007/01/09 Javascript
用JavaScript对JSON进行模式匹配 (Part 2 - 实现)
2010/07/17 Javascript
浅析JS刷新框架中的其他页面 &amp;&amp; JS刷新窗口方法汇总
2013/07/08 Javascript
jQuery获得内容和属性方法及示例
2013/12/02 Javascript
深入探寻javascript定时器
2015/01/02 Javascript
jquery实现图片左右切换的方法
2015/05/07 Javascript
C++中的string类的用法小结
2015/08/07 Javascript
超实用的javascript时间处理总结
2016/08/16 Javascript
JS获取子节点、父节点和兄弟节点的方法实例总结
2018/07/06 Javascript
vue props传值失败 输出undefined的解决方法
2018/09/11 Javascript
webpack4手动搭建Vue开发环境实现todoList项目的方法
2019/05/16 Javascript
微信小程序导入Vant报错VM292:1 thirdScriptError的解决方法
2019/08/01 Javascript
python抓取网页时字符集转换问题处理方案分享
2014/06/19 Python
python爬虫框架talonspider简单介绍
2017/06/09 Python
实时获取Python的print输出流方法
2019/01/07 Python
python入门之井字棋小游戏
2020/03/05 Python
python eventlet绿化和patch原理
2020/11/21 Python
html5响应式开发自动计算fontSize的方法
2020/01/13 HTML / CSS
REISS英国官网:伦敦High Street最受欢迎品牌
2016/12/21 全球购物
Desigual美国官方网站:西班牙服装品牌
2019/03/29 全球购物
Lentiamo荷兰:在线订购隐形眼镜、隐形眼镜液和太阳镜
2019/10/25 全球购物
汽车技术服务与营销专业推荐信
2013/11/29 职场文书
培训主管的职业生涯规划
2014/03/06 职场文书
授权委托书格式模板
2014/04/03 职场文书
《翻越远方的大山》教学反思
2014/04/13 职场文书
企业公益活动策划方案
2014/08/24 职场文书
规范化管理年活动总结
2014/08/29 职场文书
2014年医院十一国庆节活动方案
2014/09/15 职场文书
2015年妇联工作总结范文
2015/04/22 职场文书
2015年社区党建工作汇报材料
2015/06/25 职场文书
文明和谐家庭事迹材料(2016精选版)
2016/02/29 职场文书