将表单输入实时追加到 HTML 字符串

Question

我想得到 header 我的表格的问题二（和其他后续问题），以根据问题中输入的内容进行更新已发送），但尽管尝试了多种解决方案，但 SO 向我展示了我还没有成功。非常感谢任何帮助！这是我的最新版本：

我的HTML:

<input type="text" class="form-control" placeholder="Dexter" name="name" style="background-color:#DFECF5;" required data-validation-required-message="Please enter your pet's name.">...

<h3>What Breed is<div id="namer"></div></h3>

我的 JS：

$(document).ready(function () {
    $('<input name="name" type="text"/>').appendTo("div.namer");
});

编辑

从那以后我学习了 JS Angular 并且它在几秒钟内为我解决了这个问题:)

<div ng-app="">

<p>Name: <input type="text" ng-model="name"></p>
<p>You wrote: {{ name }}</p> 

</div>

Answer 1

试试这个..

      <input type="text" class="form-control dexter" placeholder="Dexter" name="name" style="background-color:#DFECF5;" required data-validation-required-message="Please enter your pet's name."/>

        <h3>What Breed is <div class="namer"></div></h3>
         <script>
    $(document).ready(function(){
        $(".dexter").blur(function(){
var dextervalue=$(".dexter").val();
$(".breed").remove();
$('<input name="name" class="breed" type="text" value"'+dextervalue+'"/>').appendTo("div.namer");
$(".breed").val(dextervalue);
        });

    });
    </script>

Fiddle:http://jsfiddle.net/cq3moa34/

将表单输入实时追加到 HTML 字符串

Live Append Form Input to HTML String

jquery

forms

input

append