在点击导出 Excel 按钮时,怎么实现使用 JavaScript 代码来显示“正在加载”元素。...
时间: 2024-02-21 16:59:03 浏览: 38
可以通过以下步骤实现在点击导出 Excel 按钮时使用 JavaScript 代码来显示“正在加载”元素:
1. 在 HTML 文件中添加一个“正在加载”元素,可以是一个 div 元素,设置其样式为 display:none,即默认情况下不显示。
2. 在点击导出 Excel 按钮时,使用 JavaScript 代码来获取“正在加载”元素,并将其样式设置为 display:block,即显示该元素。
3. 在导出 Excel 文件完成后,再次使用 JavaScript 代码将“正在加载”元素隐藏起来,即将其样式设置为 display:none。
以下是一个示例代码:
HTML 文件中添加“正在加载”元素:
```html
<div id="loading" style="display:none">正在加载,请稍后...</div>
```
JavaScript 代码:
```javascript
// 获取导出 Excel 按钮元素
var exportBtn = document.getElementById("export-btn");
// 给导出 Excel 按钮绑定点击事件
exportBtn.onclick = function() {
// 显示“正在加载”元素
var loading = document.getElementById("loading");
loading.style.display = "block";
// 执行导出 Excel 操作
// ...
// 隐藏“正在加载”元素
loading.style.display = "none";
}
```
在导出 Excel 操作完成后,需要手动隐藏“正在加载”元素,否则该元素将一直显示在页面上。