如何在eclipse实现网页中输入车牌,点击搜索信息,将停车时间显示在页面。接口代码如下:import axios from "axios"; const options = { method: 'POST', url: 'https://10.198.8.185:443/artemisl', headers: { Accept: '*/*', 'Content-Type': 'application/json', 'x-ca-key': '29801952', 'x-ca-signature-headers': 'x-ca-key', 'x-ca-signature': 'RA=', 'content-type': 'application/json' }, data: {parkSyscode: 'fe23e1', plateNo: '粤A643N0'} }; axios.request(options).then(function (response) { console.log(response.data); }).catch(function (error) { console.error(error); });接口返回信息如下{ "code": "0", "msg": "success!", "data": { "enterTime": "2023-06-09T11:50:34+08:00", "plateNo": "粤A643N0", "cardNo": "", "parkTime": 205, "delayTime": 30, "currentDeduceCost": "0.00" } }
时间: 2023-07-19 10:39:59 浏览: 155
首先,你需要在前端页面上添加一个输入框用来输入车牌号码,并添加一个按钮用来触发搜索事件。然后,在点击搜索按钮时,获取输入框中的车牌号码,并将其作为参数传递给后端接口。你可以使用 axios 库来发送 POST 请求。
以下是一个简单的实现示例:
HTML 代码:
```
<input type="text" id="plateNoInput" placeholder="请输入车牌号码">
<button id="searchBtn">搜索</button>
<p id="parkTime"></p>
```
JavaScript 代码:
```
const plateNoInput = document.getElementById('plateNoInput');
const searchBtn = document.getElementById('searchBtn');
const parkTime = document.getElementById('parkTime');
searchBtn.addEventListener('click', () => {
const plateNo = plateNoInput.value;
axios.post('https://10.198.8.185:443/artemisl', {
parkSyscode: 'fe23e1',
plateNo: plateNo,
}, {
headers: {
Accept: '*/*',
'Content-Type': 'application/json',
'x-ca-key': '29801952',
'x-ca-signature-headers': 'x-ca-key',
'x-ca-signature': 'RA=',
'content-type': 'application/json',
},
}).then(response => {
const data = response.data.data;
parkTime.innerText = `停车时间:${data.parkTime}分钟`;
}).catch(error => {
console.error(error);
});
});
```
当用户点击搜索按钮时,上面的代码将发送一个 POST 请求到指定的接口地址,并传递车牌号码作为参数。当接口返回响应时,解析响应数据并将停车时间显示在页面上。
阅读全文