0

我正在用html制作一个表单，表单的一个元素是复选框询问用户他是否有电话号码，我正在尝试执行两个操作：如果选中了复选框，我希望一个新的输入元素出现在同一个页面让用户输入他的电话号码，如果用户改变主意并尝试取消选中复选框，则删除最后一个输入并显示另一个输入以获取其他信息。当复选框被选中并且输入似乎让用户输入他的号码时，它适用于我，但如果用户改变主意或错误地选中了此复选框并取消选中它，数字的输入仍在页面中，我表示复选框中的取消选中事件在被选中后不起作用！任何帮助请...

<html>
<head><script>
function change(n){
if (n.checked)
document.getElementById("message").innerHTML = "enter your number <input type="text" ....";
if (n.unchecked)
document.getElementById("message").innerHTML = "age <input type="text" ....";
}
</script>
</head>
<body><label><input type = "checkbox" onchange = "change(this)">Checkbox</label>
<div id="message"></div>
</body>
4

1 回答 1

1

你只需要一个if..else值this.checked。所以像这样的东西 -

document.querySelector('input[type="checkbox"]').addEventListener('change', function () {
    if (this.checked) {
        document.getElementById("message").innerHTML = 'enter your number <input type="text">';
    }
    else {
        document.getElementById("message").innerHTML = 'age <input type="text">';
    }
}, false);

工作演示

于 2013-04-17T04:20:10.450 回答