javascript - 如何动态插入表单

Question

已关闭。此问题不符合 Stack Overflow guidelines 。目前不接受答案。

---

要求提供代码的问题必须表现出对所解决问题的最低限度的了解。包括尝试的解决方案、为什么它们不起作用以及预期结果。另请参阅:Stack Overflow question checklist

已关闭 9 年前。

Improve this question

我有一个页面，我希望根据数据列表值动态插入表单，而无需重新加载页面

<form action='#' method='get'>
    <input list="category" name="category">
    <datalist id="category">
        <option value="Home">
        <option value="Car">
        <option value="Mobile">
    </datalist>
    <input type="submit">
</form>

例如，如果用户选择“主页”，则“主页”表单应显示在数据列表的底部。

有人知道如何做到这一点吗？

Answer 1

你有很多选择。您可以使用 innerHTML

将它们作为字符串插入

document.getElementById("id_here").append(string); //or innerHTML = string; where string = your code above!

或者您可以采取另一条路线并使用 createElement 动态组装表单。

var x = document.createElement("form");
x.id = "derp";
document.body.idtoappendto.appendChild(x);