更改某些文本时需要延迟

Question

我需要提示！我想延迟更改一些文本。使用 .delay 它不起作用，因为它不是队列。然后我用.setTimeout试了一下。那行得通，但仅适用于一个文本框。当我添加另一个时，它无法正常工作。谁能帮帮我？

这里是代码：

$('#text-box1').hover(function() {
     $('#text-box1').text("The text changed!");
}, function() {
     $('#text-box1').text("The previous Text");
});

Answer 1

你需要知道是否有超时工作并先停止它。这是您的解决方案：

$(function(){
    var to;
    var $tb1 = $('#text-box1');

    $tb1.on('mouseenter', function(){
        if( to !== undefined ) return;
        var $this = $(this);
        to = setTimeout(function(){
            $this.text('The text changed!');
            to = undefined;
        }, 500);

    }).on('mouseleave', function(){
        if( to !== undefined ) return;
        var $this = $(this);
        to = setTimeout(function(){
            $this.text('The previous Text');
            to = undefined;
        }, 500);
    });
});

Check jsFiddle

更改某些文本时需要延迟

I need a delay when I change some text

javascript

jquery

delay