用模态框。实现前端提交弹出框的制作，弹出框为input文本框，只实现前面页面，不做后端交互

好的，关于制作前端提交弹出框，我可以给你一些建议和指导。你可以使用基于Bootstrap的modal组件来实现弹出框的制作。具体步骤如下：

步骤一：引入Bootstrap框架

在页面中引入Bootstrap的CSS和JS文件。如果你已经使用了Bootstrap的其他组件，就无需再引入它们。否则，你可以在页面头部添加以下代码：

<link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.5.0/css/bootstrap.min.css">
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.slim.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.5.0/js/bootstrap.min.js"></script>

步骤二：创建模态框

在适当的位置创建模态框的HTML结构。例如：

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="myModalLabel">提交信息</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<input type="text" class="form-control">
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
<button type="button" class="btn btn-primary">提交</button>
</div>
</div>
</div>
</div>

以上代码会创建一个id为myModal的模态框，包括一个提交信息的文本框(input)和两个按钮(关闭和提交)。

步骤三：打开模态框

你需要编写一些JavaScript代码来触发模态框的弹出显示。例如，你可以在按钮的单击事件中添加一些代码：

<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">弹出框</button>

以上代码会在单击按钮时弹出id为myModal的模态框。当然，你也可以通过调用Bootstrap提供的JavaScript方法来手动打开模态框。例如：

$('#myModal').modal('show');

以上代码会手动弹出id为myModal的模态框。

总结：

以上就是制作前端提交弹出框的基本步骤。你可以根据需要对模态框进行个性化的样式、布局和交互效果的修改和扩展。同时，也可以使用其他前端框架或原生JavaScript来实现类似的效果。