JavaScript動的作成Formフォーム

1283 ワード

本文は主にJavaScriptがFormフォームを動的に作成して提出する実現方法を紹介し、JavaScriptがページ要素を動的に作成し、フォームの提出をシミュレートするテクニックに関する.
Ajaxリクエストでページ全体がリフレッシュされないことはよく知られていますが(Ajaxローカルリフレッシュ)、ページ全体をリフレッシュする必要がある場合があります.この場合、Formを動的に作成する必要がある場合があります.
function makeForm() {
    //      form 
    var form = document.createElement("form");
    form.id = "form_id";
    form.name = "form_name";
    //     body   
    document.body.appendChild(form);
    //        
    var input = document.createElement("input");
    //        
    input.type = "text";
    input.name = "username";
    input.value = "zhangsan";
    //          form   
    form.appendChild(input);
    // form      
    form.method = "POST";
    // form      
    form.action = "/index";
    //     
    form.submit();
    //     form 
    document.body.removeChild(form);
}

makeFormを呼び出すと、すぐに新しいFormが作成され、コミットされ、Formが削除されます.新しいFormを作成する必要はなく、既存のFormに追加する場合があります. // Form var form = document.getElementById("form_id"); var input = document.createElement("input"); input.type = "text"; input.name = "username"; input.value = "zhangsan"; form.appendChild(input); form.submit();