javascript - 使用 javascript 动态更改 HTML 表单

Question

基本上我需要根据选择(也许是单选按钮)更改表单中的元素。这样 2 个表单可能在一个页面上可用。

到目前为止我已经想到了这个，但它似乎不起作用......

//javascript

function FormChange(toChange){
    if (toChange){
        var oldHTML = document.getElementById('li1').innerHTML;
        var newHTML = "Company Name: " + "<input type="text" name="companyname" />";
        document.getElementById('li1').innerHTML = newHTML;
}

//HTML

<form action="insert.php" method="post">
<li id="li1">Firstname: <input type="text" name="firstname" />
</form>

<input type = "button" value="Change that bad boy" onclick="FormChange(true)"/>

我的意图是删除名字字段并将其替换为公司名称字段。

非常感谢任何帮助，谢谢。

Answer 1

将当前的两个答案放在一起，并添加一点错误处理:

function FormChange(toChange) {
    if (toChange) {
        var elt = document.getElementById('li1');
        if (elt) {
            var newHTML = "Company Name: " + "<input type='text' name='companyname' />";
            elt.innerHTML = newHTML;
        }
    }
}


<form action="insert.php" method="post">
<ul>
<li id="li1">Firstname: <input type="text" name="firstname" /></li>
</ul>