0

テキストに従って展開される単純なテキストエリアを作成しようとしています。また、括弧をシンタックスハイライトしたいと考えています。これはすべてかなりうまく機能しますが、完全ではありません。<pre>領域のサイズを適切に変更するために必要なすべての値を保持するバックグラウンドで非表示にしてこれを行っています。非表示<pre>には、括弧のすべての色も保持されます。

まず、テキストエリアのサイズ変更がでこぼこです。Enter キーを押すと、何らかの理由でテキストが飛び出します。再現するのは簡単です。のようなものを入力するだけです

test
test

Enter キーを押すと、私の言いたいことがわかります。

第二に、括弧を強調表示する際の問題。非常に大きなものを挿入すると、次)))))))))))))))))))(((((((((((((((((((((((((((((((((((((((((((((のようになります。カラーリングがすべて台無しになります。理由がわかりません。

バグを再現するさらにクレイジーなものは

 )))))))))))))))))))((((((((((((((((((((((((((((((((((((((((((((()))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))))

どんな問題でも、どんな助けでも大歓迎です！

コードのフィドルへのリンクは次のとおりです。http://jsfiddle.net/Axvgf/41/

前もって感謝します！

4

1 に答える 1

1

括弧が一致しない場合は、深さを計算しないでください。例えば

)))(())

深さは、

undefined, undefined, undefined, 1, 2, 2, 1

また

0, 0, 0, 1, 2, 2, 1

一致しない括弧を赤く、一致する括弧をレベルごとに色付けするだけです。

テキストの下部にある空行を無視するため、Enter キーを押すとテキストがジャンプします。高さも追加する必要があります。

CSS

.defaultEm:{
  font-size:1em;
  position:absolute;
  line-height:1;
  padding:0;
  visibility:hidden
}

脚本

function getDefaultFontSize(pa){
     pa= pa || document.body;
     var who= document.createElement('span');
     who.className= 'defaultEm';
     who.appendChild(document.createTextNode('M'));
     pa.appendChild(who);
     var fs= [who.offsetWidth, who.offsetHeight];
     pa.removeChild(who);
     return fs;
}

と

var newHeight = $(newId + " pre").height() + getDefaultFontSize()[1]; //adding a height of line

固定高さ: http://jsfiddle.net/ACF8e/

于 2012-12-27T06:54:06.283 に答える