7

次のコードは、データベースからテキストエリアに配置されたテキストの例です。

<textarea id="inputPane" cols="80" rows="40" class="pane">
<p>
    some text here...
</p>
  <p>
    more text here...
</p>
</textarea>

jQueryの.trimを使用して、先頭と末尾の空白をすべて削除し、テキストエリアを以下のように表示する実際のjqueryコードは何ですか?

<textarea id="inputPane" cols="80" rows="40" class="pane">
    <p>some text here...</p>
    <p>more text here...</p>
</textarea>

私はこれに何時間も取り組んできましたが、.trim とのさまざまな組み合わせを試してみましたが成功しませんでした

$('#inputPane')jQuery.trim(string);
4

6 に答える 6

7

次のようなことを試すことができます：

jQuery(function(​$) {
    var pane = $('#inputPane');
    pane.val($.trim(pane.val()).replace(/\s*[\r\n]+\s*/g, '\n')
                               .replace(/(<[^\/][^>]*>)\s*/g, '$1')
                               .replace(/\s*(<\/[^>]+>)/g, '$1'));
});​

結果は次のとおりです。

<p>some text here...</p>
<p>more text here...</p>

これは防弾ではないかもしれませんが、テキストエリアの HTML 値から要素を作成するよりもはるかに高速で効率的であることが証明されるはずです。

于 2010-09-15T21:59:09.577 に答える
3

これを試して：

var $input = $('#inputPane');

var $container = $('<div>').html( $input.val() );

$('*', $container).text( function(i,txt) {
    return $.trim( txt );
});

$input.val( $container.html() );

のコンテンツtextareaを要素に変換し、それらをウォークスルーしてコンテンツをトリミングし、結果の HTML を に挿入しますtextarea。

編集: @bobince が指摘する.val()代わりに使用するように変更.text()

于 2010-09-15T21:47:05.543 に答える
2

これは私がそれを行う方法です（デモ）：

$('.pane').val(function(i,v){
    return v.replace(/\s+/g,' ').replace(/>(\s)</g,'>\n<');
});
于 2010-09-15T22:06:43.190 に答える
1

jQuery.trim()文字列全体から先頭と末尾の空白を削除します。この場合、最初の文字列の前<p>と最後の文字列の後</p>です。より複雑なものが必要です。それは、特定のタグ間の空白を削除することです。これは必ずしも簡単ではありませんが、（おそらく！）正規表現を使用して実行できます。たとえば、次のようになります。

// assuming val is the textarea contents:
val = val.replace(/>\s*</, '><').replace(/\s+$/, '');

免責事項：これはすぐにまとめられたものであり、すべてのケースを網羅しているわけではありません。

于 2010-09-15T21:39:11.760 に答える
1

値を取得し、値をトリミングし、値を設定します。

var value = $('#inputPane').val();
value = $.trim(value);
$('#inputPane').val(value);

または一行で：

$('#inputPane').val($.trim($('#inputPane').val()));
于 2010-09-15T21:43:23.257 に答える
1

テキストエリアから先頭/末尾の空白をトリムするためにjQueryは必要ありません。1行でコーディングする必要があります

前：

<textarea id="inputPane" cols="80" rows="40" class="pane">
    <p>some text here...</p>
    <p>more text here...</p>
</textarea>

後：

<textarea id="inputPane" cols="80" rows="40" class="pane"><p>some text here...</p></textarea>
于 2011-06-03T15:01:07.813 に答える