Question

我有一个输入，它将从cms和另一个textarea预先填充：jsFiddle

jQuery('#description_field').on('change', function () {
   var val=jQuery("#description").val();
   jQuery("#description").val(val + ' ' +jQuery( "#description_field" ).val());
});

-

<form>
   <textarea id="description_field" name="description_field"></textarea>
   <input type="hidden" id="description" name="description" value="{{ cms.tag }} <!-- Text of the textarea -->">
</form>

这实际上已经有效但是当用户想要再次更改textarea中的文本时，更改会添加到旧input文本的末尾，这不是很好。< / p>

如何以某种方式更改代码，textarea文本总是1：1？

谢谢

Answer 1

您可以更改：

var val=jQuery("#description").val();

为：

var val = jQuery("#description").attr('value');

<强> jsFiddle example

Answer 2

在附加之前存储字段值＆＃34;更改＆＃34;事件：

var val=jQuery("#description").val();
jQuery('#description_field').on('change', function () {
   jQuery("#description").val(val + ' ' +jQuery( "#description_field" ).val());
});

FIDDLE

Answer 3

以下是一种方法：

＆＃13;

//store the initial value from input
var initialValue = $("#description").val();

$('#description_field').on('input', function () {
    $("#description").val(initialValue + ' ' + $(this).val());
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<form class="form-horizontal" id="charge-form" method="post" action="" accept-charset="UTF-8">
    <textarea class="form-control" rows="3" id="description_field" name="description_field"></textarea>
    <hr>
    <input id="description" name="description" value="XYZ ">
</form>

＆＃13;

Answer 4

如果你想要1：1的文字，为什么不只是:(在下面运行）

＆＃13;

var $textarea = $('#description_field'),
    $input = $("#description");

$textarea.on('keyup', function () {
	$input.val($textarea.val());
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form class="form-horizontal" id="charge-form" method="post" action="" accept-charset="UTF-8">
      
          <textarea class="form-control" rows="3" id="description_field" name="description_field"></textarea>
    <hr>
      <input id="description" name="description" value="XYZ ">
</form>

＆＃13;

将textarea的值添加到已填充的输入中

4 个答案: