Question

<input id='myTextbox1' type='text'/>
<br><br>
<textarea>Hello my name is James</textarea>

$('#myTextbox1').on('input', function() {
    $('textarea').text($(this).val());
});

我想改变“詹姆斯”这个词。通过将其绑定到我的输入字段。到目前为止，我被卡住了，只能改变整个文本区域。我知道我可以使用div来做，但textarea怎么样？

Answer 1

建议使用contentEditable div

进行此类操作

＆＃13;

$('#myTextbox1').on('input', function() {
    $('#name').html($(this).val());
});

＆＃13;

div[contenteditable] {
  resize: both;
  border: 1px solid gray;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input id='myTextbox1' type='text'/>
<br><br>
<div contenteditable=true>Hello my name is <span id="name">James</span></div>

＆＃13;

这可能，但最好的方法是指定格式以避免复杂的字符串操作。

＆＃13;

var format = "Hi, My name is ";
$('input').on('input',function () {
  $('textarea').val(format + $(this).val());
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input value="James"><br/>
<textarea>Hi, My name is James</textarea>

＆＃13;

Answer 2

对于你的情况，另一种方式，这种方式需要一些硬代码才能以正确的方式进行。

[Fiddle][http://jsfiddle.net/giaumn/2dahonz3/1/]

使用text（）更改textarea中的某些字符

2 个答案: