Javascript 单击按钮时关闭模式窗体并打开新窗体

所以，我正在为学校项目建立一个网站，但似乎有一个部分遇到了一些问题。我有一个注册链接，用户可以注册成为该网站的成员。一旦注册链接被点击，模态窗体就会弹出在屏幕中间，用户将数据输入到特定的字段中。完成后，他们单击页面底部的提交按钮“Go”。这会触发另一个模态表单，弹出“感谢您注册Dominion豪华车”。右上角有一个X，当他们点击它时，我注意到注册模式表单仍然打开。我试图使它，以便当“去”按钮被点击时，注册模式的形式关闭。到目前为止，注册模式表单关闭的唯一方式是单击右上角的X。我也想保留这个。基本上，我希望当点击X或点击“Go”按钮时，注册模式表单关闭，如果点击“Go”按钮，我希望模式表单显示“感谢您注册Dominion豪华车”

谢谢任何能帮助我的人。我真的很感激

以下是我的代码的JSFIDLE版本，出于某种原因，表单不会使用JSFIDLE弹出，但是我知道代码可以工作，您可以将其发布到文本编辑中进行测试

//HTML代码


订阅Dominion豪华车新闻信？


围棋
感谢您注册Dominion豪华车
X
//CSS代码
/********************************************************************************************************************/
/*设计模态形式*/
/********************************************************************************************************************/
#目标{
不透明度：1；
指针事件：自动；
}
.结束{
背景:#606061；
颜色：#FFFFFF；
线高：25px；
位置：绝对位置；
右：-12px；
文本对齐：居中；
顶部：-10px；
宽度：24px；
文字装饰：无；
字体大小：粗体；
-webkit边界半径：12px；
-moz边界半径：12px；
边界半径：12px；
-莫兹盒阴影：1px 1px 3px#000；
-网络工具包盒阴影：1px 1px 3px#000；
盒影：1px 1px 3px#000；
}
.关闭：悬停{
背景：#000000；
}
/********************************************************************************************************************/
/*样式模式注册*/
/********************************************************************************************************************/
.modalSignUp{
位置：固定；
字体系列：Arial、Helvetica、无衬线字体；
排名：0；
右：0；
底部：0；
左：0；
背景：rgba（0,0,0,0.8）；
z指数：99999；
不透明度：0；
-webkit过渡：不透明度400ms缓进；
-moz过渡：不透明度400ms缓进；
过渡：不透明度400ms缓进；
指针事件：无；
}
.modalSignUp>div{
宽度：300px；
位置：相对位置；
利润率：10%自动；
填充：5px20px 13px 20px；
边界半径：10px；
背景：#fff；
背景：-moz线性梯度（#fff，#999）；
背景：-webkit线性梯度（#fff，#999）；
背景：-o-线性梯度（#fff，#999）；
高度：250px；
}
.modalSignUp表{
左缘：2%；
利润率最高：10%；
宽度：100%；
}
.modalSignUp按钮{
浮动：对；
右边距：8px；
}
.signuplogo{
左边缘：35%；
}
.通讯{
宽度：285px；
高度：20px；
左边距：自动；
右边距：自动；
字体大小：10px；
}
/********************************************************************************************************************/
/*样式模式确认*/
/********************************************************************************************************************/
.modalConfirm{
位置：固定；
字体系列：Arial、Helvetica、无衬线字体；
排名：0；
右：0；
底部：0；
左：0；
z指数：99999；
不透明度：0；
指针事件：无；
}
.modalConfirm>div{
宽度：300px；
位置：相对位置；
利润率：10%自动；
填充：5px20px 13px 20px；
边界半径：10px；
背景：#fff；
背景：-moz线性梯度（#fff，#999）；
背景：-webkit线性梯度（#fff，#999）；
背景：-o-线性梯度（#fff，#999）；
高度：250px；
}
.modalConfirm p{
边缘顶部：50px；
文本对齐：居中；
}
//JAVASCRIPT
函数openSignUp（）{
document.getElementsByClassName（'modalSignUp'）[0].id='target'；
}
函数closeSignUp（）{
document.getElementsByClassName（'modalSignUp'）[0]。id=''；
}
函数openConfirm（）{
document.getElementsByClassName（'modalConfirm'）[0].id='target'；
}
函数closeConfirm（）{
document.getElementsByClassName（'modalConfirm'）[0].id=''；
}

只需添加

document.getElementsByClassName('modalSignUp')[0].style.display = 'none';

到您的

openConfirm（）

函数

或或者添加

文档。GetElementsByCassName（'modalSignUp'）[0]。id=''就像您在
closeSignUp（）函数中使用的一样


或只需调用函数
closeSignUp（）在函数中
openConfirm（）

你拥有一切。您只需修改
onclickdocument.getElementsByClassName('modalSignUp')[0].style.display = 'none';

<button type="submit" onClick="openConfirm(); closeSignUp();">Go</button>