延迟事件监听器

Question

在JavaScript中，我有一个元素（这是一个输入标签）。

此代码：

element.addEventListener("focus", function () {
    this.parentNode.parentNode.style.outline = this.parentNode.parentNode.dataset.ans_outline;
});

当输入聚焦时，轮廓会立即改变。

我的问题是：我怎么能推迟这个活动？

我试过了:

element.addEventListener("focus", function () {
    setTimeout(function(node) {
        node.parentNode.parentNode.style.outline = node.parentNode.parentNode.dataset.ans_outline;
    }(this), 1000)
});

.. 但它不起作用:(

Answer 1

试试这个：

element.addEventListener("focus", function () {
    var node = this;
    setTimeout(function() {
        node.parentNode.parentNode.style.outline = node.parentNode.parentNode.dataset.ans_outline;
    }, 1000)
});

setTimeout函数的第一个参数是你要执行的函数（不要直接调用这个函数）。

您可以在 node 变量中存储对 this 的引用，然后在您的超时函数中使用它（参见 closures）

Answer 2

删除对 this 的引用并以这种方式提供：

element.addEventListener("focus", function () {
    $this = this;
    setTimeout(function() {
        $this.parentNode.parentNode.style.outline = $this.parentNode.parentNode.dataset.ans_outline;
    }, 1000)
});

延迟事件监听器

Delay eventListener

javascript

this

addeventlistener

settimeout