如何修剪文本区域内的文本

Question

我有一个文本区域，我想修剪其中的文本并显示结果。

例子：

“1234”

变成

“1234”

但是由于某种原因，它不会修剪文本，也不会返回任何内容。

HTML

<form id="form1">
 <textarea id="text-area" rows="20" cols="50" placeholder="text here..."></textarea><br>        
 <button class="button" onclick="myFunc()">Sumbit</button>
</form>

JS

function myFunc(){

    var getText = document.getElementById("text-area").textContent;
    var result = getText;

    result.trim();

    document.getElementById("text-area").textContent = result;
}

请不要 JQuery

Answer 1

它失败了，因为.trim不会改变实际的字符串。 它返回一个新字符串。 您需要做的就是result = result.trim();

 function myFunc(){ var result = document.getElementById("text-area").value; console.log(result); result = result.trim(); console.log(result); document.getElementById("text-area").value = result }

 <textarea id="text-area" rows="20" cols="50" placeholder="text here..."></textarea> <br> <button class="button" onclick="myFunc()">Sumbit</button>

Answer 2

您需要使用value属性，而不是textContent 。 并且trim()返回一个新字符串，而不是修改旧字符串。 您还可以使代码更简洁。

演示：

 function myFunc() { var ta = document.getElementById("text-area"); ta.value = ta.value.trim(); }

 <textarea id="text-area" rows="20" cols="50" placeholder="text here..."></textarea><br> <button class="button" onclick="myFunc()">Submit</button>

（注意：我删除了表单标签，所以它不会提交表单，所以当你按下提交时你可以看到修剪操作的结果。我还纠正了错字 - Sumbit应该是Submit 。

Answer 3

result.trim()返回一个新字符串，它不会修改现有字符串。

    document.getElementById("text-area").textContent = result.trim();

Answer 4

试试这个：

function myFunc(){

    var getText = document.getElementById("text-area").textContent;
    document.getElementById("text-area").textContent = getText.trim();
}

trim 方法不会影响调用它的字符串。 它返回修剪后的字符串。