jQuery timout函数干扰切换

时间:2017-04-07 12:48:57

标签: javascript jquery

我有一个复选框,我希望只检查7秒钟,然后取消选中。我已将下面的代码放在一起,但尽管尝试清除超时,但如果用户在切换时多次点击,它似乎会干扰切换。

任何人都可以帮助我找到一种更简洁的方法来做到这一点,如果用户点击太频繁,这种方法不会出现错误吗?

$('input#foo').on('change', function(){
    clearTimeout(timeout);
    if ( $(this).is(':checked') ) {
        $('#box').addClass('splash').stop();
        $( "div.title" ).html( 'Hide thing' );
        var timeout = setTimeout(function() {
          if ( $('input#foo').is(':checked') ) {
            $('input#foo').prop('checked', false).change();
          }
        }, 7000);
    } 
    else {
        $('#box').removeClass('splash').stop();
        $( "div.title" ).html( 'Reveal thing' );

    }
  });

2 个答案:

答案 0 :(得分:0)

从此行中删除.change(),然后尝试一下。 $('input#foo')。prop('checked',false);

答案 1 :(得分:0)

我已经设置好这个动作只有在点击后7秒才有效,这应该可以解决行为错误

HTML

<input class="checkbox" type="checkbox">I will become unchecked in 7 seconds<br>

的jQuery

$(".checkbox").click(function() {
  setTimeout(function() {
    $('.checkbox').prop('checked', false);
  }, 7000);
});

小提琴 -

https://jsfiddle.net/8y8zu47p/2/