7

以下代码是从数据库放入文本区域的文本示例。

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

使用 jQuery 的 .trim 删除所有前导和尾随空格并让 textarea 显示与下面非常相似的实际 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>

尽管这可能不是万无一失的，但它应该被证明比从 textarea 的 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.

编辑：修改为使用.val()而不是.text()@bobince 所指出的

于 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()将从整个字符串中删除前导和尾随空格 - 在这种情况下，在 first 之前<p>和 last 之后</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 从 textarea 修剪前导/尾随空格。您需要在 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 回答