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 で最新の値を取得する前に、「apply changes」などの関数を呼び出す必要がありますか?

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 に答える