Question

当数据加载延迟时，我试图向用户显示页面加载功能。它工作但相反。如果页面中有一个表格，并且表格长度为零，则它将显示页面加载功能，例如请稍候。因此，我尝试使用jQuery做类似的事情：

<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/sweetalert2@7.29.1/dist/sweetalert2.all.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/promise-polyfill"></script>
<script type="text/javascript">
            $(window).load(function () {
                if ($('table').length != 0) { //Checking the table length here
                    swal.close(); //Close when data uploaded
                    console.log($('table').length);
                }
                else if ($('table').length == 0) {
                    swal.showLoading(); //Show when data upload delayed or zero
                    console.log($('table').length);
                }
            });
</script>

这很简单，但是它最初在页面中上传数据时没有显示请稍候功能。当我尝试反向操作时，例如，页面已加载，然后功能正常运行。我在这里错过了什么吗？

Answer 1

将完全加载窗口内的所有元素后，将触发Jquery的load事件。这就是为什么您的代码仅在加载已经完成时（当您将其反转时）才能工作的原因。

{
  "name": "my-app",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "react": "^16.6.3",
    "react-dom": "^16.6.3",
    "react-scripts": "2.1.1"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ]
}

此功能内的所有内容都将在页面完全加载后触发。尝试这样做。

$(window).load(function () {

参考：https://api.jquery.com/load-event/

下一条语句不执行-jQuery

1 个答案: