是否有可能只使用JS創建表單？

我想創建一個只使用JavaScript的表單。我的意思是爲網頁創建一個表單，向它添加元素，設置它們的值並提交表單。
此外，如果JavaScript在瀏覽器中被禁用，則應提交正常的HTML表單。是否有可能只使用JS創建表單？

有什麼辦法可以達到這個目的嗎？

謝謝大家。

2009-10-29 SocialCircus

此外，這可以也可以通過僅使用someDiv.innerHTML來實現。

#!javascript 
var formDiv = document.getElementById('my_form_div'); // you hopefully have a better method to do this ;) 
if (formDiv) { 
    var HTML = '<form method="GET" action="?submit" onsubmit="return !formSubmitted()">'; 
    HTML += '<input type="text" name="field1" />'; 
    HTML += '<input type="text" name="field2" />'; 
    HTML += '<input type="submit" value="go" />'; 
    HTML += '</form>'; 
    formDiv.innerHTML = HTML; 
}

注意功能formSubmitted()。這個在用戶提交表單時被調用，然後你可以在JS中做任何你想要的東西，比如通過AJAX提交表單值，並且如果你返回true（例如當你在JS中成功處理表單時），真倒轉到假，表單不會通過瀏覽器提交。如果用戶已經禁用JS，表單將被瀏覽器以標準方式提交。

這樣做的好處是，您可以通過AJAX獲得想要的HTML格式，由PHP生成，您可以通過調用相同的PHP函數獲取<noscript>標籤中的完全相同的HTML標籤HTML：

... some HTML 
<div id="my_form_div"> 
<noscript> 
    <?= myFormHTML() ?> # equal to: <?php echo myFormHTML() ?> 
</noscript> 
... more HTML

來源

2009-10-29 10:33:31 Pascal

有一個正常的HTML表單，用JS隱藏它。要做到這一點，沒有閃爍的一個好辦法是：

<body> 
    <script type="text/javascript"> 
    document.getElementsByTagName('body')[0].className = "js" 
    </script> 
    <style type="text/css"> 
    body.js #no_javascript_form { display: none; } 
    </style> 
    <form id="no_javascript_form">...</form> 
</body>

然後動態創建<form>。使用jQuery你可以做：

<div id="form_placeholder"></div> 
<script type="text/javascript"> 
    $('#form_placeholder').append(
    $('<form/>') 
     .append('<input type="text"/>') 
     .append('<button type="submit">submit</button>') 
); 
</script>

來源

2009-10-29 09:46:39 orip

你也很容易通過javascript使用的東西添加HTML的格式如jQuery的append方法

來源

2009-10-29 09:48:30 Whisk

var input = document.createElement('input'); 
    input.name = 'generated_input'; 
    document.getElementbyId('inputs_contained').appendChild(input);

看到這裏 - Adding new text box using javascript

來源

2009-10-29 09:55:11 LiamB

是否有可能只使用JS創建表單？

回答

相關問題