在html里居中增加一个按钮用来发送Post
您可以使用以下代码在HTML中居中放置一个按钮,以向服务器发送POST请求:
<!DOCTYPE html>
<html>
<head>
<style>
/* 居中样式 */
.center {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
</style>
</head>
<body>
<div class="center">
<button onclick="sendPost()">发送POST请求</button>
</div>
<script>
function sendPost() {
// 创建XMLHttpRequest对象
var xhr = new XMLHttpRequest();
// 设置请求方式和URL
xhr.open("POST", "your-url", true);
// 设置请求头
xhr.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
// 设置响应类型
xhr.responseType = "json";
// 设置回调函数
xhr.onreadystatechange = function() {
if (xhr.readyState === XMLHttpRequest.DONE) {
if (xhr.status === 200) {
// 请求成功
console.log(xhr.response);
} else {
// 请求失败
console.log("请求失败");
}
}
};
// 发送请求
xhr.send(JSON.stringify({data: "your-data"}));
}
</script>
</body>
</html>
您需要将 your-url 替换为您要发送POST请求的URL,将 your-data 替换为您要发送的数据。如果您要发送的数据是表单数据,可以使用 FormData 对象来构建。
此外,您需要使用JavaScript编写发送POST请求的逻辑,并在按钮的 onclick 事件中调用该函数。在上面的示例中,我们使用了 XMLHttpRequest 对象来发送POST请求,并使用回调函数处理响应。您还可以使用 fetch 或其他JavaScript库来发送POST请求。
原文地址: https://www.cveoy.top/t/topic/sjE 著作权归作者所有。请勿转载和采集!