Question

我有一个动态创建的HTML页面，可以添加输入。

我希望能够使用html（）函数捕获页面（以及所有表单输入值）。

这似乎不起作用。以下页为例：

<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
$( document ).ready(function() {
        $( "#_create" ).click(function() {
            var myHtml = '<input class="my-input" val="">';
            $('#_input').html(myHtml);
        });
        $( "#_save" ).click(function() {
            alert($('#_masterDiv').html());

        });
        $( "#_saveIterate" ).click(function() {
            $("input").each(function(){
                alert(this.value);
            });
        });
    });
</script>
</head>
<body>
    <button id="_create">Create Dynamic Input</button><br>
    <button id="_save">Save by grabbing html</button><br>
    <button id="_saveIterate">Save by iterating</button><br>
    <div id="_masterDiv">
        <div id="_input">Input button here</div><br>
    </div>
</body>
</html>

单击“通过抓取html保存”获取表单，但不会获取值。单击“通过迭代保存”获取输入值。

在获取INPUT中的最新值之前，是否需要调用类似“应用更改”的函数？

Answer 1

某些浏览器（如Firefox / Chrome）无法保存HTML输入值的当前状态。因此，您必须手动分配输入值：

$( document ).ready(function() {
        $( "#_create" ).click(function() {
            var myHtml = '<input class="my-input" value="">';
            $('#_input').html(myHtml);
        });
        $( "#_save" ).click(function() { 
         //if you have many input fields, loop through them all           
            $("input").each(function(){                
                //set the value manually
                this.setAttribute('value', this.value);                
            });            
            alert($('#_masterDiv').html());

        });
        $( "#_saveIterate" ).click(function() {
            $("input").each(function(){
                alert(this.value);
            });
        });
    });

这是jsfiddle链接：http://jsfiddle.net/urspz/1/

我可以用html（）保存动态表单而不是通过INPUT迭代吗？

1 个答案: