syntaxhighlighter语法高亮自动换行

在 v2.x 的版本中，是可以支持自动换行的， 但存在换行在移动端行号对齐的问题。

SyntaxHighlighter自动换行以及更正行号的方法

自动换行

更改CSS

文件路径：syntaxhighlighter/syntaxhighlighter3/styles/shCore.css

.syntaxhighlighter .line {
  /*white-space: pre !important;*/
  /*修改自动换行*/
  white-space:pre-wrap !important;
  word-break:all-break;
}

.syntaxhighlighter table td.code .container textarea {
  box-sizing: border-box !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  border: none !important;
  background: white !important;
  padding-left: 1em !important;
  overflow: hidden !important;
  /*white-space: pre !important;*/
  /*修改自动换行*/
  white-space:pre-wrap !important;
  word-break:all-break;
}

更新行号

自动换行后，会有行号不一致的问题，所以要更新行号

添加js代码

文件路径：syntaxhighlighter/syntaxhighlighter3/scripts/shCore.js

/*修改自动换行更新行号 20190710*/
$(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('style', 'height:' + height + '!important'); 
            // fix by Edi, for JQuery 1.7+ under Firefox 15.0
            console.debug($gutterLine.height(), height, $gutterLine.text(), $codeLine);
        });
    });
};