从表单实时更新数据答案

【问题标题】：real time data updating from form从表单实时更新数据
【发布时间】：2011-09-23 03:40:41
【问题描述】：

我有一个用户输入收据数据的动态表单。我试图克隆他们在一个单独的 div 上输入的内容，该 div 旨在看起来像他们输入的收据。我想显示文本的值并将元素选择到那个单独的 div 中。

我试图在 jquery 中执行此操作。有人举个例子吗？

编辑

问题是我不知道如何获取 div id，因为它是动态生成的。

【问题讨论】：

【解决方案1】：

我建议使用 keyup 事件。假设您像这样设置输入字段和 div：

<input type="text" id="receipt_no" />
<p>Preview:</p>
<div id="preview"></div>

您可以在 jQuery 中执行以下操作：

$('#receipt_no').keyup(functon () {
    var preview_text = $(this).val();
    $('#preview').html(preview_text);
});

您可以稍后通过为receipt_no keyup 和其他表单元素的更改事件（例如下拉菜单）添加一个通用函数来使其更复杂。您只需使用预览所需的所有元素构建 preview_text 即可。

【讨论】：

【解决方案2】：

这是一个简单的示例：

HTML：

<div id="inputDiv">
<textarea></textarea>
<div>

<div id="previewDiv"><div>

js:

$(function(){
  $("#inputDiv textarea").keydown(function(){
    $("#previewDiv").text($(this).value());
  });
});

【讨论】：