在SyntaxHighlighter中啓用換行符而不會破壞行號

Question

SyntaxHighlighter顯示沒有換行符的行。長行顯示在一行中，並且水平滾動條被添加到容器中。

我不希望那個滾動條，我可以用一些強制執行但簡單的CSS規則強制在SyntaxHighlighter中換行。

問題是內容和行號不會顯示在同一個容器中，因此如果行按這種方式分割，行號將不匹配正確的行。

有沒有機會讓它工作而不麻煩？任何想法歡迎..！

Answer 1

這是正路我終於做到了：

// return a jQuery object listing all highlighted lines as divs 
      // sh: SyntaxHighlighter 
      // alias: brush alias 
      // content: the code to highlight 
    getHighlightedLines = function (sh, alias, content) { 

     var brushes = sh.vars.discoveredBrushes, 
      Brush, brush; 

     if (!brushes) { 
      brushes = {}; 

      _.each(sh.brushes, function (info, brush) { 

       var aliases = info.aliases; 

       if (aliases) { 
        info.brushName = brush.toLowerCase(); 

        for (var i = 0; i < aliases.length; i += 1) { 
         brushes[aliases[i]] = brush; 
        } 
       } 
      }); 

      sh.vars.discoveredBrushes = brushes; 
     } 

     Brush = sh.brushes[brushes[alias || 'plain']]; 

     if (!Brush) { 
      return $(); 
     } 

     brush = new Brush(); 
     brush.init({toolbar: false, gutter: false}); 

     return $(brush.getHtml(content)).find('.line'); 
    }, 

這樣使用它：

var $table = $('<table/>'); 

getHighlightedLines(sh, settings.types[current.type], content).each(function (i) { 
    $('<tr/>') 
     .append($('<td/>').addClass('nr').append(i + 1)) 
     .append($('<td/>').addClass('line').append(this)) 
     .appendTo($table); 
}); 

現在你有行號，並在同一行上線的內容，即使代碼被包裹。其他任何事情都可以用CSS來完成。