Javascript 单击jquery将div追加到正文

为了给登录添加一个小弹出窗口，我使用jquery在用户单击按钮后将div及其内容添加到页面中。我不知道为什么，但每次我点击按钮，div就会正常出现，但会立即消失。请帮忙

问题在于

忘记密码

按钮

代码如下：

let form=$（'form'）；
让passwordRequest=$（''）；
text（'忘记密码？'）；
attr（'id'，'passwordRequest'）；
passwordRequest.appendTo（表单）；
函数requestForgottenPassword（）{
让popup=$（''）.appendTo（表单）；
attr（'id'，'passwordPopup'）；
};
$（密码请求）。在（'单击'，函数（）上）{
requestForgottenPassword（）；
});
#密码弹出窗口{
宽度：200px；
高度：200px；
位置：绝对位置；
背景色：浅绿色；
}
#登录{
显示器：flex；
弯曲方向：立柱；
对齐项目：居中；
证明内容：中心；
填充：50px；
背景色：#fff；
边界半径：20px；
盒影：2px5px40pxRGB（201201201）；
}
形式{
显示器：flex；
弯曲方向：立柱；
对齐项目：居中；
填充：10px；
}
氢{
字体大小：20px；
字体大小：300；
边缘顶部：10px；
}
输入[类型=文本]，
输入[类型=密码]{
填充：10px；
宽度：300px；
利润率：10px；
边界半径：3px；
边框：1px实心rgb（221221221）；
字体大小：14px；
过渡时间：200ms；
}
输入[类型=提交]{
填充：5px15px；
边缘顶部：30px；
字体大小：16px；
字号：600；
大纲：无；
光标：指针；
边界半径：3px；
边框：1px实心rgb（114114114）；
过渡时间：100ms；
}
#密码请求{
字体大小：14px；
文字装饰：无；
颜色：rgb（62184255）；
边缘顶部：20px；
边界：无；
大纲：无；
光标：指针；
背景色：透明；
过渡时间：100ms；
填充物：5px；
}
#密码弹出窗口{
宽度：200px；
高度：200px；
位置：绝对位置；
背景色：浅绿色；
}

登录
用户名
密码
在默认情况下是
type=“submit”
（即使没有
类型
）-

您遇到的问题是实际提交的表单

使用
type=“button”
，或与jQuery脚本一起使用：

const passwordRequest=$（“”{
文本：“忘记密码？”，
id:“密码请求”，
键入：“按钮”，
附录：表格
});

例如：


let form=$（'form'）；
const passwordRequest=$（“”{
文本：“忘记密码？”，
id:“密码请求”，
键入：“按钮”，
附录：表格
});
函数requestForgottenPassword（）{
让popup=$（''）.appendTo（表单）；
attr（'id'，'passwordPopup'）；
};
$（密码请求）。在（'单击'，函数（）上）{
requestForgottenPassword（）；
});
#密码弹出窗口{
宽度：200px；
高度：200px；
位置：绝对位置；
背景色：浅绿色；
}
#登录{
显示器：flex；
弯曲方向：立柱；
对齐项目：居中；
证明内容：中心；
填充：50px；
背景色：#fff；
边界半径：20px；
盒影：2px5px40pxRGB（201201201）；
}
形式{
显示器：flex；
弯曲方向：立柱；
对齐项目：居中；
填充：10px；
}
氢{
字体大小：20px；
字体大小：300；
边缘顶部：10px；
}
输入[类型=文本]，
输入[类型=密码]{
填充：10px；
宽度：300px；
利润率：10px；
边界半径：3px；
边框：1px实心rgb（221221221）；
字体大小：14px；
过渡时间：200ms；
}
输入[类型=提交]{
填充：5px15px；
边缘顶部：30px；
字体大小：16px；
字号：600；
大纲：无；
光标：指针；
边界半径：3px；
边框：1px实心rgb（114114114）；
过渡时间：100ms；
}
#密码请求{
字体大小：14px；
文字装饰：无；
颜色：rgb（62184255）；
边缘顶部：20px；
边界：无；
大纲：无；
光标：指针；
背景色：透明；
过渡时间：100ms；
填充物：5px；
}
#密码弹出窗口{
宽度：200px；
高度：200px；
位置：绝对位置；
背景色：浅绿色；
}

登录
用户名
密码
感谢您的快速回答，但要正确理解这一点：如果我没有将按钮设置为type=button，那么无论发生什么情况，表单都会提交？@cote<代码>
将始终提交包装
。因此，使用
type=“button”
总是好的（即使不使用表单，也只是为了养成习惯）。我知道写
@cote是愚蠢的，想象一下互联网的早期——一种形式。拥有
的唯一逻辑思维是提交该表单。此后，
type=“submit”
只是为了向后兼容，并允许引入
type=“button”
作为覆盖。至少我认为当时的情况是这样的；）