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删除，因此您的下一行将再次位于第一个位置。

同时更改您的循环条件，因为length split正在减少while(textareavalue.length)：

id

您还应该向span提供span，因为您的网页上（或将来）可能存在其他span个标记。

最好在每次点击时清除<textarea cols="40" rows="10" id="sometext"> </textarea> <br /> <button id="remove">Remove</button> <br /> <span id="out"><span/>内容，因此它只显示上次删除操作的结果。

如果没有同时发生它可能会很好，因为那时你只看到最终结果。你可以使用这样的计时器：

<强> HTML

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

<强> JS

<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<title>Este texto es el título del documento</title>
<style>
.texto1 { font-size: 40px; }
#texto2 { font-size: 50px; }
body { background-color:green; }
</style>
</head>
<body>
<p class="texto1">Mi texto</p>
<p id="texto2">Mi texto2</p>
<p>Mi texto3</p>
</body>
</html>

这是fiddle。

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 个答案: