0

PHP によってデフォルト値が割り当てられた複数の入力ブロックを含むフォームがあり、ブロックの 1 つの HTML マークアップを PHP スクリプトに渡したいと考えています。マークアップを例示するために私のフォームの変更されたスニペットを次に示します。

<form action="/page/do_work/job_number" id="work_form">
    <textarea style="display: none;" name="markup" id="markup"></textarea>
    <div id="block_1">
        <table>
            <tr>
                <td><input type="text" value="123" /></td>
                <td><input type="text" value="123" /></td>
            </tr>
        </table>
    </div>
    <div id="block_2">
        <table>
            <tr>
                <td><input type="text" value="abc" /></td>
                <td><input type="text" value="abc" /></td>
            </tr>
        </table>
    </div>
</form>

テーブルの HTML をテキストエリアにコピーできるように、jQuery を使用してフォームの送信をリッスンしています。

$('#work_form').submit(function(){
    // Snatch the markup
    var markup = $('#block_1', '#work_form').html(); 
    // Place it into the textarea
    $('#markup', '#work_form').html( markup );
    // Move on
    return true;
});

問題は、変更された値がテキストエリアにコピーされていないことです。たとえば、値を「abc」から「xyz」に変更しても、テキストエリアに渡されるマークアップは「abc」のままです。どんな助けでも大歓迎です。

編集:.html()テキストエリアにマークアップを追加するか、その両方を使用.val()しますが、入力の値の変更がテキストエリアに挿入されたマークアップに反映されない理由を知りたいです。さらに調査すると、入力フィールドの値を変更して Firebug で調査すると、デフォルト値が保持されていることがわかります。何らかの方法で DOM を更新する必要がありますか?

編集 2:変数markupが設定されていますが、入力フィールドに加えた変更がテキストエリアに挿入されたマークアップに反映されていません。

4

3 に答える 3

1

試す、

$('#markup', '#work_form').val( markup );

また、console.log（markup）をスローして、マークアップ変数が正しく設定されていることを確認します。

于 2012-10-17T18:39:24.437 に答える
1

テキスト領域については、 「innerhtml」ではなく「値」を変更する必要があり、それが.html の機能です。

$('#markup').val(markup)

これを試して。

于 2012-10-17T18:40:34.487 に答える
1

入力フィールドを変更しても DOM は変更されません。.submit()DOM を変更するために、関数を次のように編集しました。

$('#work_form').submit(function(){
    // Update the DOM
    var block_1 = $('#block_1', '#work_form');
    block_1.find('input').each(function(i,e){
        el = $(e);
        el.attr('value', el.val());
    });
    // Snatch the markup
    var markup = block_1.html(); 
    // Place it into the textarea
    $('#markup', '#work_form').html( markup );
    // Move on
    return true;
});

この質問に私を指摘してくれてありがとう@PherricOxide：

INPUTタグのVALUE属性(&その値)でHTMLフォームのinnerHTMLを読む

于 2012-10-17T23:34:09.367 に答える