请用htmlcssjs写一个页面页面里包括一个文本域输入框宽度500高度自动和一个展示文字内容的div宽度500高度自动。写一个发送POST请求的封装的函数请求参数是json格式函数返回值填充到展示文字内容的div
<!DOCTYPE html>
<html>
<head>
<title>POST请求封装示例</title>
<meta charset="utf-8">
<style>
textarea {
width: 500px;
height: auto;
}
div {
width: 500px;
height: auto;
border: 1px solid #ccc;
padding: 10px;
margin-top: 10px;
}
</style>
</head>
<body>
<textarea id="input"></textarea>
<button onclick="sendRequest()">发送请求</button>
<div id="output"></div>
<script>
function sendRequest() {
var input = document.getElementById("input").value;
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState === XMLHttpRequest.DONE) {
if (xhr.status === 200) {
var response = JSON.parse(xhr.responseText);
document.getElementById("output").innerHTML = response.result;
} else {
console.log("请求失败:" + xhr.status);
}
}
}
xhr.open("POST", "http://example.com/api");
xhr.setRequestHeader("Content-Type", "application/json");
xhr.send(JSON.stringify({input: input}));
}
</script>
</body>
</html>
原文地址: https://www.cveoy.top/t/topic/bgNf 著作权归作者所有。请勿转载和采集!