如何提交表单并保存至数据库？——教你submit的用法 (submit 提交表单数据库)
在网页制作中，尤其是在前后端分离、动态交互内容多的网页中，表单是一个非常重要的元素，它可以搜集用户的信息并将信息与后台进行交互，这样网页便能提供更为吸引人的功能和内容。而在表单提交中，该如何使用submit方法，从而成功将用户填写的信息保存至数据库中呢？本篇文章将为各位网页制作者详细介绍submit的使用方法。
一、了解submit方法
submit方法是HTML DOM对象中的方法，它用于将当前表单的信息提交给服务器，也就是将form中的数据提交至后台，以供后续处理。在使用该方法时，常常会搭配使用button或input标签类型的submit按钮，从而实现表单的快速提交。
二、submit方法的基本用法
在使用submit方法前，需要先获得表单的DOM对象，在获取到表单对象后，需要为该表单对象调用submit方法，并将所需要提交的数据、提交方式等作为参数传入submit方法中，才能成功将表单数据传递至后台。
以下是submit方法的基本用法：
“`javascript
document.forms[0].submit();
“`
该段代码会将之一个表单对象提交至后台，若要将特定的表单对象提交至后台，需要通过表单ID或表单名称进行调用，如下所示：
“`javascript
document.getElementById(‘formId‘).submit();
document.getElementsByName(‘formName‘)[0].submit();
“`
在submit方法中，还可以指定表单数据的提交方式，如get、post等，该方式需要与后台处理方式一致。在进行表单提交时，常常需要对表单数据进行验证，该验证过程也可通过submit方法实现。
三、submit方法的应用实例
假设我们现在需要制作一个基于node.js的表单提交功能，并将提交结果保存到MongoDB数据库中，该如何来实现呢？
在网页端的HTML代码中，可以使用如下所示的方式编写表单：
“`html
“`
上述代码中，表单数据的提交方式为POST，提交地址为http://localhost:3000/submited，输入框中分别为“用户名”、“邮箱”和“留言”三个输入框，以及一个提交按钮。
在网页端的JavaScript脚本中，可以使用如下所示的方式来调用submit方法，并将表单数据传递至后台：
“`javascript
document.getElementById(“Form01”).onsubmit = function(){
var username = document.getElementsByName(“username”)[0].value;
var eml = document.getElementsByName(“eml”)[0].value;
var message = document.getElementsByName(“message”)[0].value;
var data = {
username: username,
eml: eml,
message: message
}
var xhr = new XMLHttpRequest();
xhr.open(“POST”, “http://localhost:3000/submited”, true);
xhr.setRequestHeader(“Content-Type”, “application/json; charset=UTF-8”);
xhr.send(ON.stringify(data));
}
“`
在上述JavaScript代码中，首先通过表单名称或ID获取表单对象，使用onsubmit方法监听表单提交事件，在该事件中获取表单内容，并通过XMLHttpRequest对象将表单内容以ON对象形式发送至后台。需要注意的是，在此处表单数据的提交方式应与网页端编写的表单数据提交方式一致，此处为POST方式提交。
在后台处理程序中，可以使用如下所示的方式接收表单数据：
“`javascript
var bodyParser = require(‘body-parser’);
require(‘./db/db’);
var submitedSchema = new mongoose.Schema({
username: String,
eml: String,
message: String,
time: {
type: Date, default: Date.now
}
});
var Submited = mongoose.model(‘submiteds‘,submitedSchema);
app.use(bodyParser.json());
app.post(‘/submited‘, function(req,res){
var newSubmited = new Submited({
username: req.body.username,
eml: req.body.eml,
message: req.body.message
});
newSubmited.save(function(err,doc){
if(err){
res.send(‘sorry,unknown error‘);
return;
}
res.send(‘success‘);
});
});
“`
在上述代码中，通过body-parser中间件解析表单数据，将表单数据保存至MongoDB数据库中，并返回操作是否成功的“success”或错误信息的“sorry,unknown error”。
综上所述，使用submit方法实现表单快速提交的方法非常简单便捷，只需要通过JavaScript获得表单对象，并传递至后台即可。在实际应用中，为了保证代码的易读性、可维护性，我们通常会将JavaScript代码、CSS样式、数据库处理程序等分离开来，并通过模块引入的方式进行集成。
相关问题拓展阅读：
submit函数把数据提交到什么地方去了
一个表单: ….. 你点提交以后,1.php就被打开。
函数的定义通常分为传统定义和近代定义，函数的两个誉拦定义本质是相同的，只是叙述概念的出发点不同，传统返虚迟定义是从运动变化的观点出发，而近代定义是从、映射的观点出发漏李。
比如说有一个表单：
…..
你点提交以后，1.php就被打开。同时，他也接收到了表单。
针对补充：简正森
所有的处理表单的拦亩页面都使用服务器端语言。
服务器端语言是在服务器端就对表单进行处理的。你查看源代码是看不到服务器端语言的。
比如你举的例子，它可能使用php进行表单处理，将处理完的结果直接生成在页面上清备。也就是说，你看源代码看到的是被服务器端语言处理完后的源代码，里面不能也不可能看到它如何连接数据库。并且，这个页面完整的源代码（包含服务器端语言）你是看不到的。
如果你想了解服务器如何处理表单，推荐你去学一学php。
form中action指向的贺态处理程序，比如.asp .php .jsp
或者洞首别的，禅颤源通常较这些处理程序叫cgi
关于submit 提交表单数据库的介绍到此就结束了，不知道你从中找到你需要的信息了吗 ？如果你还想了解更多这方面的信息，记得收藏关注本站。
