General

テキストエリアで、リターン時に自動的にbrを入れる。

2009年11月28日

Nucleusでは各アイテムの表示のとき、改行コードに自動的に<br />が付加される。ブログ設定でこの機能を使うかどうかを設定できるようになっている。

ただこのやり方では、例えばテーブルを作成したい場合などに自動的に追加された<br />が邪魔になってしまう。

そこでJeansでは、アイテム編集画面でJavascriptを使って解決することを考えた。リターンキーを押したときに<br />が自動的に追加されるようにする。このあたりは、HTMLのことをよく知らないユーザーにはあまりフレンドリーではないが、そこは別途WYSIWYGを用意することで対処することにして、とりあえず自分自身が使いやすいと思うインターフェースにしてみる。

試行錯誤の後に完成したJavascriptが、次のとおり。とりあえず、FireFoxとIEでの動作を確認した。OperaとかSafariではまだ未試験だが、とりあえず後回しでよかろう。

<html><body>
<script type="text/javascript">
function test(element,event){
    if (event.keyCode!=13) return true;
    if (event.shiftKey) return true;
    if (element.selectionStart) {
        // FireFox
        var t=''+element.value;
        var start=element.selectionStart;
        var end=element.selectionEnd;
        element.value=t.substring(0,start)+'<br　/>'+t.substring(start);
        element.selectionStart=start+6;
        element.selectionEnd=end+6;
        return true;
    } else if (element.createTextRange) {
        // IE
        var range = document.selection.createRange();
        range.text='<br />';
        range.select();
        return true;
    }
    return true;
}
</script>
<textarea onKeyPress="return test(this,event);" cols="100" rows="30"></textarea>
</body></html>

紆余曲折の結果、上のコードになった。リターンキーを押すと、<br />が自動的に付加される。付加したくない場合は、Shift + Enterで。

以下、不採用になった書きかけのコード。IEで、selectionStartとselectionEndを実現するためのもの。この部分はうまく動いていたので捨てるにしのびず、メモしておく。

var range = document.selection.createRange();
var range2= range.duplicate();
range2.moveToElementText(element);
range2.setEndPoint('EndToEnd',range);
var start = range2.text.length - range.text.length;
var end = start + range.text.length;

コメント

Julianne (2026年5月1日 01:56:46)

A lower starting amount can make ohline gaming feel
more accessible. At an online casino with minimum deposit,users can begin without
unnecessary pressure. Modern audiences often look for clear payment details, comfortable account features, and ann
eazsy overall flow. As a result, there iss a pleasant experience.

Terese (2026年5月1日 03:47:14)

Instant withdrawal features can make online gaming feel
much more convenient from the very first session. On a platform designed
for immediate payouts, players may spend less time waiting ffor funds.
This kind of flexibility often makes the experience feel more user-friendly.

A lot off players value easy-to-follow ayment information, practical account features, and
a well-organized layout. As a result, there iis a pleasant environment that feels
efficcient throughout play.

Florida (2026年5月1日 05:36:48)

Real money play can make online entertainment feel more viviod annd rewarding.

At an online casino for real money, players may feel a deeper sense of involvement while playing.
Modern auddiences often look for transparent conditions, practical balance tools, and a user-friendly layout.

This combination helps create a well-balanced environment with a smooth overakl flow throughout play.

コメント送信