Обрезать начальные / конечные пробелы из textarea с помощью jQuery? - PullRequest
7 голосов
/ 16 сентября 2010

Следующий код является примером текста, помещенного в текстовое поле из базы данных.

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

используя jtquery .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);

Ответы [ 6 ]

7 голосов
/ 16 сентября 2010

Вы можете попробовать что-то вроде этого:

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 текстовой области.

3 голосов
/ 16 сентября 2010

Попробуйте это:

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

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

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

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

Он превращает содержимое textarea в элементы, просматривает их и обрезает содержимое, а затем вставляет полученный HTML-код обратно в textarea.


РЕДАКТИРОВАТЬ: Изменено для использования .val() вместо .text(), как отмечено @ bobince

1 голос
/ 03 июня 2011

Вам не нужен 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>
1 голос
/ 16 сентября 2010

Вот как бы я это сделал ( демо ):

$('.pane').val(function(i,v){
    return v.replace(/\s+/g,' ').replace(/>(\s)</g,'>\n<');
});
1 голос
/ 16 сентября 2010

Получить значение, обрезать значение, установить значение:

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

Или в одну строку:

$('#inputPane').val($.trim($('#inputPane').val()));
1 голос
/ 16 сентября 2010

jQuery.trim() удалит начальные и конечные пробелы из всей строки - в этом случае до первого <p> и после последнего </p>.Вы хотите что-то более сложное, то есть удалить пробелы между определенными тегами.Это не обязательно легко, но может (возможно!) Быть выполнено с помощью регулярного выражения, например:

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

ОТКАЗ ОТ ОТВЕТСТВЕННОСТИ: Это было просто быстро составлено и может не охватывать всеслучай.

...