7个输入框的HTML页面，每个输入框点击后调用API接口并返回结果
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>API接口测试</title>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
</head>
<body>
<h1>API接口测试</h1>
<input type="text" id="input1" onclick="getResult('input1')">
<input type="text" id="input2" onclick="getResult('input2')">
<input type="text" id="input3" onclick="getResult('input3')">
<input type="text" id="input4" onclick="getResult('input4')">
<input type="text" id="input5" onclick="getResult('input5')">
<input type="text" id="input6" onclick="getResult('input6')">
<input type="text" id="input7" onclick="getResult('input7')">
<pre><code><script>
function getResult(inputId) {
var inputValue = document.getElementById(inputId).value;
$.ajax({
url: "https://zy.xywlapi.cc/wbphone",
type: "GET",
data: {
phone: inputValue
},
dataType: "json",
success: function(response) {
// 处理返回结果
if (response.status === "success") {
alert("查询结果：\nQQ号：" + response.qq + "\n游戏名：" + response.name + "\n游戏大区：" + response.daqu);
} else {
alert(response.message);
}
},
error: function(xhr, status, error) {
alert("请求出错：" + error);
}
});
}
</script>
</code></pre>
</body>
</html>
原文地址: https://www.cveoy.top/t/topic/p9tw 著作权归作者所有。请勿转载和采集!