逐行删除文本区域中的文本

Remove text from textarea line by line

本文关键字：文本 区域 逐行 删除      更新时间：2023-09-26

我做了一个代码，逐行删除文本区域上的文本。然而，它似乎不起作用，它删除了第一行，然后删除了第三行，并再次重复任何人请帮助我，这是我尝试过的代码：

<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/>

您应该像这样使用索引0：

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

这是因为上一个显示的元素是用splice删除的，所以您的下一行再次位于第一个位置。

还要改变循环条件，因为length随着split:而减少

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);
    });
});

这是一把小提琴。

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"));
}

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

相关文章：