jQuery timout函数干扰切换

Question

我有一个复选框，我只想保持选中状态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' );

    }
  });

Answer 1

从此行中删除.change（），然后尝试。 $（'input＃foo'）。prop（'checked'，false）;

Answer 2

我已对其进行了设置，因此该操作仅在单击后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/