回调函数中的setTimeout不起作用

setTimeout in a callback function not working

本文关键字:setTimeout 不起作用 函数 回调      更新时间:2023-09-26

有人能在下面的代码中找到问题吗

$(document).ready(function () {
    $("#leftsettingswindow").on("keyup", "#fontsize2", function () {
        setTimeout(function () {
            var txtVal = this.value;
            $('#content').css("font-size", txtVal + "%");
        }, 3000);
    });
});

这是完美的,

$(document).ready(function () {
    $("#leftsettingswindow").on("keyup", "#fontsize2", function () {
            var txtVal = this.value;
            $('#content').css("font-size", txtVal + "%");
    });
});

任何想法?

this不是一个局部变量,所以它没有保存在闭包中。您需要为它绑定一个局部变量:

$(document).ready(function () {
    $("#leftsettingswindow").on("keyup", "#fontsize2", function () {
        var savedThis = this;
        setTimeout(function () {
            var txtVal = savedThis.value;
            $('#content').css("font-size", txtVal + "%");
        }, 3000);
    });
});

setTimeout不在同一作用域中调用。所以this不是第二个例子中的this

...
var self = this;
setTimeout(function () {
  var txtVal = self.value;
  $('#content').css("font-size", txtVal + "%");
}, 3000);
...

感谢Barmar在另一个帖子上回答了这个问题。

"this"不是一个局部变量,所以它不会保存在闭包中。您需要为它绑定一个局部变量:

$(document).ready(function () {
    $("#leftsettingswindow").on("keyup", "#fontsize2", function () {
        var savedThis = this;
        setTimeout(function () {
        var txtVal = savedThis.value;
            $('#content').css("font-size", txtVal + "%");
        }, 3000);
    });
});

在代码片段中,值" 3秒后返回"undefined"

用selector代替这个

$(document).ready(function() {
  $("#leftsettingswindow").on("keyup", "#fontsize2", function() {
   setTimeout(function() {
      var txtVal = $('#fontsize2').val();
      $('#content').css("font-size", txtVal + "%");
    }, 3000);
  });
});