我正在尝试制作一个网站,在这个网站上,页面上的文本字段可以通过网站进行更新。在网站的 "管理 "页面,我允许用户在按下按钮时通过运行AJAX请求来设置字段。然而,当按下按钮时,没有任何事情发生。
我使用的是Express.js + E.js + JQuery。
admin.ejs
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="css/admin.css">
<title>Manage the website</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#submitButton").click(function(){
$.ajax({
url: 'updateData',
type: 'POST',
data: {
text: '[email protected]',
message: 'hello world!'
},
});
});
});
</script>
</head>
<header>
<!-- Put partial includes here -->
</header>
<div class="topPage">
<h1>Hello, <%= firstName %>!</h1>
<p1>
Find a value you would like to edit, then press send. The website can take up to 10 mins for the changes to apply. The changes will not change live.
</p1>
</div>
<div class="homepage">
<div class="information">
<h1>
Homepage variables
</h1>
<p1>
Variables for the 'homepage' page are displayed below. Changes can take up to 10 mins to apply globally.
</p1>
<hr>
</div>
<div class="form">
<label>
Change the 'body' of 'homepage'
</label>
<form action="javascript:void(0)">
<input type="text" id="textField" name="text" value="<%= pageData.get('homepage').homeBody%>" required>
<input type="submit" id="submitButton">
</form>
</div>
</div>
<script>
</script>
</html>
我将表单的动作设置为void,以确保页面不会重新加载,但我仍然需要Ajax工作。
在 website.js
文件(快递应用所在)I console.log()
的请求主体,以确保它是通过。没有任何记录。
website.js
app.post('/updateData', async (req, res) => {
console.log(req.body)
})
Ajax应该在表单提交按钮被按下时运行。
我是一个新手,所以所有的帮助是非常感激!我是一个新手,所以所有的帮助是非常感激。
谢谢你的帮助
id="submitButton "应该是一个按钮,而不是一个输入。改变输入id标签,在Form里面添加一个按钮,并给 "submitButton "作为ID。
希望对你有帮助