Ueditor高亮插件SyntaxHighlighter問題修正

Ueditor高亮插件SyntaxHighlighter問題修正

1、如果一行代碼太長，就會造成代碼塊過寬，修改shCoreDefault.css，加上word-break:break-all：

.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;
 border-radius: 4px !important;
 border-collapse: separate !important;
 word-break: break-all;
}

2、雙擊以後文本框大小不對錯位問題，修改shCore.js，為文本框增加高度：

/**
 * Quick code mouse double click handler.
 */
function quickCodeHandler(e)
{
 var target = e.target,
 highlighterDiv = findParentElement(target, '.syntaxhighlighter'),
 container = findParentElement(target, '.container'),
 textarea = document.createElement('textarea'),
 highlighter
 ;
 if (!container || !highlighterDiv || findElement(container, 'textarea'))
 return;
 highlighter = getHighlighterById(highlighterDiv.id);
 // add source class name
 addClass(highlighterDiv, 'source');
 // Have to go over each line and grab it's text, can't just do it on the
 // container because Firefox loses all \n where as Webkit doesn't.
 var lines = container.childNodes,
 code = []
 ;
 for (var i = 0; i < lines.length; i++)
 code.push(lines[i].innerText || lines[i].textContent);
 // using \r instead of \r or \r\n makes this work equally well on IE, FF and Webkit
 code = code.join('\r');
 // For Webkit browsers, replace nbsp with a breaking space
 code = code.replace(/\u00a0/g, " ");
 // inject <textarea/> tag
 textarea.appendChild(document.createTextNode(code));
 textarea.style.height = "100%";//加上這一行，指定文本框的高度為100%
 container.appendChild(textarea);
 // preselect all text
 textarea.focus();
 textarea.select();
 // set up handler for lost focus
 attachEvent(textarea, 'blur', function(e)
 {
 textarea.parentNode.removeChild(textarea);
 removeClass(highlighterDiv, 'source');
 });
};

3、行號顯示錯位的問題，加上一段js人工解決：

//處理syntaxHighlighter換行問題
$(function () {
 fixLineNum();
});
function fixLineNum()
{
 // 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.log($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();
}