Question

我有以下代码（Javascript和HTML）：

<div id="welcomename">
<h1>Welcome! What's your name?</h1>
<input type="text" class="form" name="name" placeholder="Your name here!" id="name"/>
<input type="button" onclick="clicked();" value="I'm ready!"/>
</div>
<br>

<div id="welcomehowareyou">
<h1>How are you today, ?</h1>
<input type="text" class="form" name="howareyou" id="howareyou"/>
<input type="button" onclick="clicked();" value="I'm ready!"/>
</div>
</div>
<br>

<script>
function clicked() {
var name = document.getElementById('name').value;
if(confirm('Hello ' + name + ', great to see you!'))
{
document.getElementById('welcomehowareyou').innerHTML = 'How are you today, ' + name + '?';
document.getElementById('welcomename').style.display = "none";
}
}
</script>

基本上在第一种形式中，用户输入名称，然后点击提交并出现Javascript确认，说'How are you today, ' + name + '?'

当他们点击“确定”提示时，如何显示“ welcomehowareyou ”表单（不在警报中）？

还有一件事，它说'How are you today, ?'如何让用户以“ welcomename ”形式输入名称？

Answer 1

ID应位于<h1>，而不是<div>。否则，当您使用.innerHTML时，您将替换DIV中的所有内容，而不仅仅是该消息。

<div>
<h1 id="welcomehowareyou">How are you today, ?</h1>
<input type="text" class="form" name="howareyou" id="howareyou"/>
<input type="button" onclick="clicked();" value="I'm ready!"/>
</div>

Answer 2

试试这段JavaScript：

<script>
function clicked() {
var name = document.getElementById('name').value;

if(confirm('Hello ' + name + ', great to see you!')) {
    document.getElementById('welcomehowareyou').firstElementChild.innerHTML = 'How are you today, ' + name + '?';
    document.getElementById('welcomename').style.display = "none";
}

}
</script>

Answer 3

我已设法使用以下代码解决此问题：

**<div id="hiddenDiv" style="visibility:hidden;">**
<h1 id="welcomehowareyou">How are you today, ?</h1>
<h1>How are you today, ?</h1>
<input type="text" class="form" name="howareyou" id="howareyou"/>
<input type="button" onclick="clicked();" value="I'm ready!"/>
**</div>**
<br>

<script>
function clicked() {
var name = document.getElementById('name').value;
if(confirm('Hello ' + name + ', great to see you!'))
{
document.getElementById('welcomehowareyou').innerHTML = 'How are you today, ' + name + '?';
document.getElementById('welcomename').style.display = "none";
**document.getElementById("hiddenDiv").style.visibility ="visible";**
}
}
</script>

Javascript使表单出现

3 个答案: