如何替换文本区域中的特定行？

Question

我正在尝试仅替换文本区域中的一行

我正在尝试更改该行，以便在同一表单的其他地方进行选择时更新该行。

我认为最好将文本区域读入数组，根据需要修改数组元素，然后将其写回文本区域。

这有效，但我将其附加到当前值，而不是替换它们。

如何替换它们？

或者有更好的方法吗？

这是文本区：

<textarea  name="msg" id="msg"  style="height: 150px; width: 300px;">
first line is OK
sendline is also fine

new val=
this line is fine    
</textarea>

我要替换的行是new val= 我正在尝试用 new val= 和 $('#test').val();

中的值替换它

这是我目前的 jquery：

$('#test').on('change', function() {
    var test = $(this).val();      
    var lines = $('#msg').val().split(/\n/);
    lines[2] = "new val= " + test;
    $.each(lines , function(i, val) { 
        $("#msg").append("\r\n" + lines[i]);
    })

和一个 fiddle 显示它在做什么。

有什么想法吗？

谢谢

Answer 1

$('#msg').html('Message');

使用 .html() 而不是 append() method.The html 方法用您的新消息替换 textarea 标签之间的所有内容。

.append() 方法用于在元素内添加内容

例子

<div id="content">
<p>Hello World</p>
</div>

.append() will add new content inside <div>
.html() will replace the content inside the <div>

更新

<script>

$('#test').on('change', function() {
            var test = $(this).val();      
            var lines = $('#msg').text().split(/\n/);
            lines[3] = "new val= " + test;
            $('#msg').html("");
            $.each(lines , function(i, val) { 

                $("#msg").append("\r\n" + lines[i]);
            }); 
        });
</script>

http://jsfiddle.net/84pk258r/1/

您好，检查更新后的代码现在可以正常工作了！

Answer 2

您应该使用 .html() 将行添加到文本区域或先将其清空。此外，您没有更改正确的行索引，也无需使用 .each() 遍历行，您只需使用 .join().

这是一个工作示例：

$(function(){
  
    $('#test').on('change', function() {
        var test = $(this).val();      
        var lines = $('#msg').val().split(/\n/);
        lines[3] = "new val= " + test;
        $("#msg").html(lines.join("\n"));
    });
  
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<select id='test' name='test'>
    <option value='1234'>1234</option>
    <option value='3456'>3456</option>
    <option value='4445'>4445</option>
</select>    
<br/><br/>

<textarea  name="msg" id="msg"  style="height: 150px; width: 300px;">
first line is OK
sendline is also fine

new val=
this line is fine    
</textarea>

如何替换文本区域中的特定行？

How to replace a specific line in textarea?

jquery

replace

textarea