Javascript 当用户点击enter键时，会出现新的输入

我正在用HTML编写一个“mad libs”类型的程序——基本上，用户会被问到一系列问题，点击submit，脚本会打印一个包含他们答案的故事

我如何使它，当用户写他们的答案，他们可以点击回车键，新的问题将出现？我希望问题一个接一个地显示出来-只有在用户回答了前面的问题之后。所以它有点像动画。有办法做到这一点吗

window.writeValues=函数（表单）{
var Greeting=form.Greeting.value；
var fname=form.fname.value；
var名人=form.名人.value；
document.getElementById（'RESULT'）.innerHTML=问候语+“”+fname+“它是”+名人；
}

请输入您的名字：

请输入名人：

请输入问候语：

结果：

. 

如果这是您要找的内容，则此操作有效：（抱歉，时间太长，我无法帮助您完成此操作，抱歉：）

var questions=[“请输入您的姓名”、“请快速输入”、“请输入问候语”]//问题
var answers=[]
var question=0//您正在回答的问题数量
var que=document.getElementById（“问题”）
que.innerHTML=问题[问题]
问题:++
window.writeValues=函数（表单）{
var myinput=document.getElementById（“inpbox”）//从中获取输入的文本框
var que=document.getElementById（“问题”）
answers.push（myinput.value）//将用户输入输入列表
如果（问题！==3/*列表长度*/）{
que.innerHTML=问题[问题]
问题:++
console.log（问题）
}
否则{
document.getElementById（'RESULT'）.innerHTML=answers[0]/*获取答案1*/+“”+answers[1]+“它是”+answers[2]；
}
}
window.res=函数（）{
var myinput=document.getElementById（“inpbox”）
问题=0
que.innerHTML=问题[0]
问题:++
答案=[]
document.getElementById（'RESULT'）。innerHTML=“”
myinput.value=“”
}
window.addEventListener（“按键向下”，函数（事件）{
如果（event.key==“输入”）{
writeValue（）
}
});//如果按enter键提交

请键入您的姓名：

结果：

. 重置

这样做涉及到很多问题

您需要隐藏除第一个问题外的所有问题（通过CSS），然后在回答问题时显示它们

我们需要找出下一个元素的位置，以便显示它

需要创建事件侦听器，以便在按下enter键时执行正确的操作

当表单重置时，我们需要再次隐藏问题，并通过

onreset（）

方法清除结果

var getNextSibling=函数（元素、选择器）{
var sibling=elem.nextElementSibling；
while（兄弟姐妹）{
if（sibling.matches（选择器））返回同级；
sibling=sibling.nextElementSibling
}
};
函数writeValue（表单）{
var Greeting=form.Greeting.value；
var fname=form.fname.value；
var名人=form.名人.value；
document.getElementById（'RESULT'）.textContent=Greeting+“”+fname+“”+名人；
}
函数重置问题（）{
var elements=questionForm.querySelectorAll（“div.question-parent”）；
elements.forEach（element=>{
元素。removeAttribute（“样式”）；
});
document.getElementById（“结果”）.textContent=“”；
}
document.getElementById（'questionForm'）。addEventListener（'keypress'，evt=>{
var keyCode=evt.keyCode | | evt.which；
如果（键代码=='13'）{
var nextElement=getNextSibling（evt.target.parentNode，'div'）；
if（nextElement）{
nextElement.style.display=“block”；
返回false；
}
}
});
formdiv:not（：第一个孩子）{
显示：无；
}

请输入您的名字：
请输入一位名人：
请输入问候语：
结果：

. 
我在您的问题中添加了一个堆栈片段。如果单击RunCodeSnippet，您将看到代码中存在一些语法错误。在你的HTML中也有一些。您可以尝试修复这些问题，另外，您可能希望阅读一些关于如何使用JavaScript处理表单的web教程。谢谢！很抱歉，应该马上修复！我的代码运行良好，我只是最关心的动画方面，如果有人有任何提示？谢谢！这是一个很大的帮助！