fastadmin 点击按钮使用ajax 轮询代码,未达到条件则layui提示加载中
时间: 2024-12-08 22:16:14 浏览: 12
FastAdmin是一个基于ThinkPHP5开发的后台管理系统模板,它提供了一套简洁、高效的后台管理解决方案。如果你想要实现点击按钮后的AJAX轮询,并通过layui显示"加载中"的提示,你可以按照以下步骤编写代码:
首先,在HTML模板中创建一个按钮并绑定事件处理函数:
```html
<button id="refresh-btn">加载中...</button>
<div id="loading-mask"></div>
```
然后,在JavaScript部分,可以使用layui提供的layer插件来显示加载提示,同时使用jQuery的$.ajax轮询功能:
```javascript
$(document).ready(function() {
var btn = $('#refresh-btn');
var loadingMask = $('#loading-mask');
// 轮询函数
function poll(conditionFunction) {
$.ajax({
url: 'your-api-url', // 替换为你的实际API请求地址
type: 'GET',
dataType: 'json',
success: function(data) {
if (conditionFunction(data)) {
// 条件满足时取消轮询,关闭提示
clearInterval(intervalId);
layer.close(loadingMask);
// 对数据进行处理或展示
// ...
} else {
// 未满足条件,继续轮询
loadingMask.html('加载中...');
}
},
error: function() {
// 请求失败时关闭提示
layer.close(loadingMask);
}
});
}
// 设置初始轮询
poll(function(data) { return data.status; });
// 阻塞按钮点击,直到轮询结束
btn.click(function(event) {
event.preventDefault();
loadingMask.show(); // 显示加载提示
});
});
```
在这个例子中,`conditionFunction`是你自定义的判断条件,比如检查返回的数据是否达到某个状态。如果满足条件,就停止轮询,关闭提示;如果不满足,则持续轮询。
阅读全文