0

我有一个动态创建的 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 中的最新值之前,是否需要调用“应用更改”之类的函数?

4

1 回答 1

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/

于 2013-10-13T16:21:23.743 回答