<!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>
请用htmlcssjs写一个页面页面里包括一个文本域输入框宽度500高度自动和一个展示文字内容的div宽度500高度自动。写一个发送POST请求的封装的函数请求参数是json格式函数返回值填充到展示文字内容的div

原文地址: https://www.cveoy.top/t/topic/bgNf 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录