我对网络应用程序和 javascript 很陌生，当我提交表单时，我试图进入感谢页面。但它只是进入一个空白页面。我已经查过了，但似乎没有任何效果。我知道它必须对我的 res.end() 做一些事情，因为如果我不这样做，它只会让我的索引页不断地执行加载符号。
任何建议都会很棒!谢谢。
谢谢.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Thank you</title>
</head>
<body>
<h1>Thank you!!!!!</h1>
</body>
</html>
我的index.html中的表单部分
<div class=container2>
<form method="post" action="/thankyou.html" enctype="multipart/form-data" autocomplete="off" >
<fieldset>
// all my inputs and selectors
<input type="submit" value="Submit">
</fieldset>
</form>
</div>
我的 server.js(node) 的一部分
var express = require('express');
var path = require('path');
var server = express();
var formidable = require("formidable");
var XMLHttpRequest = require("xmlhttprequest").XMLHttpRequest;
var xhr = new XMLHttpRequest();
var request = require("request");
server.use(function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
res.header('Access-Control-Allow-Methods','GET,PUT,POST,DELETE,OPTIONS');
next();
});
var url = '*****************************';
var port = process.env.port || 63342;
// Define ./public as static
server.use(express.static(path.join(__dirname, 'public')));
server.post("/thankyou.html", function(req, res, next) {
processFormFieldsIndividual(req, res);
});
//All POST's use processFormFieldsIndividual
//server.post('*', processFormFieldsIndividual);
server.listen(port, function () {
console.log('listening on port ' + port);
});
function processFormFieldsIndividual(req, res) {
// take the values from the form and store it to
// the schema for patient.
var form = new formidable.IncomingForm();
form.on('field', function (field, value) {
switch (field) {
//puts values in json
});
form.on('end', function () {
res.writeHead(200, {
'content-type': 'text/plain'
});
// checks if the exists before it does a put or post.
var exists = checkIfExist(schema.name.family, schema.birthDate);
// if exists do a put
if (exists) {
res.end();
xhr.open("PUT", url, true);
xhr.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
xhr.onreadystatechange = function () {
if (xhr.readyState == 4 && (xhr.status == 201 || xhr.status == 200)) {
console.log(xhr.responseText);
}
else
console.log(xhr.responseText);
};
xhr.send(JSON.stringify(schema));
}
// if doesn't exist do a post
else {
res.end();
xhr.open("POST", url, true);
xhr.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
xhr.onreadystatechange = function () {
if (xhr.readyState == 4 && (xhr.status == 201 || xhr.status == 200)) {
console.log(xhr.responseText);
}
};
xhr.send(JSON.stringify(schema));
}
console.log(JSON.stringify(schema));
});
form.parse(req);
}
最佳答案
您想要在完成处理后进行重定向。看这个问题:Nodejs - Redirect url 。只需重定向到您想要的成功页面即可。
如果您的成功页面位于 forms/Congratulations.html，则您的重定向将如下所示:
res.redirect('forms/Congratulations.html');
删除 res.end() 并将重定向放在逻辑的最后。你会得到这样的结果:
xhr.send(JSON.stringify(schema));
res.redirect('forms/Congratulations.html');
关于javascript - 提交表单时转到新的 html 页面，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37846416/