逐行从textarea中删除文本

Question

我做了一段代码，逐行删除了textarea上的文本。 但是似乎不起作用，它在第三行之后删除了第一行并再次重复任何一个帮助我，这是我尝试过的代码：

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<script>
$(document).ready(function(){
$('#remove').click(function(){
var textareavalue = $('#sometext').val().split("\n");

for(i=0; i < textareavalue.length;i++)
{
$('span').append('<br />Remove: '+textareavalue[i]);    
textareavalue.splice(0, 1);
$('#sometext').val(textareavalue.join("\n"));
}


});
});
</script>
</head> 







<textarea cols="40" rows="10" id="sometext"></textarea>
<br />
<button id="remove">Remove</button>
<br />
<span><span/>

Answer 1

您应该这样使用索引0 ：

$('span').append('<br />Remove: '+textareavalue[0]);

这是因为先前显示的元素已通过splice删除，因此您的下一行再次位于第一个位置。

还要更改循环条件，因为这种split会使您的length减小：

while(textareavalue.length)

您还应该给span指定一个id ，因为您的页面上（或将来）可能会存在其他span标签。

每次单击都可以清除span内容，因此它仅显示最后一次删除操作的结果。

最好不要同时发生所有事件，因为那样您就可以看到最终结果。 您可以使用这样的计时器：

的HTML

<textarea cols="40" rows="10" id="sometext">
</textarea>
<br />
<button id="remove">Remove</button>
<br />
<span id="out"><span/>

JS

function removeLine() {
    if ($('#sometext').val().replace(/\n$/, '').length === 0) {
        // nothing to do
        return;
    }
    var textareavalue = $('#sometext').val().split("\n");
    // log line that will be removed
    $('#out').append('<br />Remove: '+textareavalue[0]); 
    // remove line
    textareavalue.splice(0, 1);
    $('#sometext').val(textareavalue.join("\n"));
    // remove next line with delay
    setTimeout(removeLine, 200);
}

$(function(){
    $('#remove').click(function(){
        // clear log
        $('#out').html('');
        setTimeout(removeLine, 200);
    });
});

这是一个小提琴。

Answer 2

for(var i=0, l = textareavalue.length; i < l; i++) {
    $('span').append('<br />Remove: '+textareavalue[0]);    
    textareavalue.splice(0, 1);
    $('#sometext').val(textareavalue.join("\n"));
}

Answer 3

是的，由于使用了splice（）方法，使用新数据和循环更新的数组本身也在同一数组上重复。 在循环内将i值更改为0。

逐行从textarea中删除文本

问题描述

3 个解决方案

解决方案1
2 已采纳 2015-11-21 08:12:03

解决方案2
0 2015-11-21 08:16:43

解决方案3
0 2015-11-21 08:22:20

逐行从textarea中删除文本

问题描述

3 个解决方案

解决方案1 2 已采纳 2015-11-21 08:12:03

解决方案2 0 2015-11-21 08:16:43

解决方案3 0 2015-11-21 08:22:20

解决方案1
2 已采纳 2015-11-21 08:12:03

解决方案2
0 2015-11-21 08:16:43

解决方案3
0 2015-11-21 08:22:20