Question

问题：单击复选框后我将光标更改为“等待”，但仅在大约6秒后才会看到等待光标。如何避免这6秒暂停？

非常感谢提前 Wicki 代码编辑！

    <html>
    <head>
    <title>Cursor-Test</title>
    <script type="text/javascript">
    var k = 0;
    var t1 = 0;
    var t2 = 0;
    function cursor_wait() {
      document.body.style.cursor = 'wait';
      t1 = (new Date()).getTime();
      k = k+1;
    }

    function cursor_clear() {
      document.body.style.cursor = 'default';
    }
    function st() {
      setTimeout(calc,500); //wait a bit
    }

    //long time action
    function calc() {
      ta = (new Date()).getTime();
      var dummy = 0;
      k = k+1;
      for (var i=0; i<1000000;i++) {
        for (var z=0; z<2000;z++) {
          dummy = dummy + z + i;
        }
      }
      tb = (new Date()).getTime();
      tr = tb-ta;
      cursor_clear();
      t2 = (new Date()).getTime();
      alert("nach clear, k="+k+" all time:"+(t2-t1)+" computing time:"+tr);
    }
    </script>
    </head>
    <body>
    <h2>Cursor ändern: standard->wait->länger dauernde Aktion->standard</h2>
    <div>wait-cursor erst nach ca. 6 sec</div>
    <form name="some_form" action="index.php" method="get">
    <input type="checkbox" name="nameless" value="5"
     onMouseDown="cursor_wait()" onMouseUp="st()" /> Five
    </form>
    </body>
    </html>

Answer 1

首先，将c设置为光标样式对你没有任何帮助。即使定义了c，它也是一个字符串。更改c的值只会使其指向不同的字符串，而不是更改光标的样式。你可能想这样做：

    var c = document.body.style;
    var t1 = 0;
    var t2 = 0;
    function cursor_wait() {
      c.cursor = 'wait';
      t1 = (new Date()).getTime();
      k = k+1;
    }

    function cursor_clear() {
      c.cursor = 'default';
    }
    //long time action
    function calc() {
      setTimeout(cursor_clear, 6000);
    }

我删除了其他代码，以便在6秒后清除光标而不阻止用户界面时更容易看到可以执行的操作。

光标“等待”，而“time-consumer”在恢复标准后运行

1 个答案: