Javascript щелкнул и не нажал в течение 4 секунд

У меня есть вопрос о моем коде. То, что я пытаюсь сделать, - это если нажата некоторая кнопка, и она не будет нажата снова в течение 4 секунд, элемент будет показан, а другой элемент скроется. Но если он щелкнут в течение 4 секунд, он останется таким же и так далее. Я думаю, что я должен использовать SetInterval() и ClearInterval(). В настоящее время у меня есть еще две функции, которые делают другие вещи. Может быть, я могу работать там?Javascript щелкнул и не нажал в течение 4 секунд

Надеюсь, я прояснил ситуацию.

Текущий Javascript код:

var clicks = 0; 
function clicks5times() { 
    clicks = clicks+1; 
    if(clicks == 6){ 
    document.getElementById('scherm3').style.display = 'block'; 
    document.getElementById('scherm2.2').style.display = 'none'; 
    } 
}   

var clicked = false; 
setInterval(function(){ 
    if (!clicked) { 
    document.getElementById("scherm4").style.visibility = "visible"; 
    document.getElementById("scherm2.2").style.visibility = "hidden"; 
    } 
},13000); 

document.getElementById("buttontimer").addEventListener("click", function(){ 
    clicked = true; 
});

источник

2016-06-15 annaneedshelp

Вместо того, чтобы устанавливать интервал, я бы сказал, что таймер будет лучше. Например:

var clickTimer; 

function startTimer() { 
    clickTimer = window.setTimeout(function(){ 
     document.getElementById("scherm4").style.visibility = "visible"; 
     document.getElementById("scherm2.2").style.visibility = "hidden"; 
    },4000); 
} 

function stopTimer() { 
    window.clearTimeout(clickTimer); 
} 

function restartTimer() { 
    stopTimer(); 
    startTimer(); 
} 

document.getElementById("buttontimer").addEventListener("click", function(){ 
    restartTimer(); 
});

Таким образом, если вы хотите, чтобы остановить таймер или запустить таймер, нужно просто позвонить выше функций для других сценариев.

например:

Если у вас есть функция инициализации:

function init() { 
... 
//some code 
startTimer(); 
}

И возможно назвать остановить таймер примерно так:

function clicks5times() { 
    ... 
    stopTimer(); 
}

источник

2016-06-15 09:21:39

таймер лучший подход в этом случае +1. –

Работа таймера начинается, но функция «stop» не работает. Как я должен реализовать это в своем HTML? – annaneedshelp

Если вы хотите его остановить, вызовите функцию clearTimer, и он должен остановиться. –

в Javascript

<!DOCTYPE html> 
<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 

</head> 
<body> 
<button id="buttontimer">fghfgh</button> 

</body> 
</html><!DOCTYPE html> 
<html> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 

</head> 
<body> 
<button id="buttontimer">fghfgh</button> 
<script> 

document.getElementById('buttontimer').onclick = function(){ 
document.getElementById("buttontimer").disabled=true; 
setInterval(function(){ 
    if (document.getElementById("buttontimer").disabled == true) { 
    document.getElementById("buttontimer").disabled = false; 
    } 
},10000); 

}; 
</script> 
</body> 
</html>

и Jquery

<!DOCTYPE html> 
    <html> 
    <head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script> 
    <script> 
    $(document).ready(function(){ 

    var button = $('<button>Click Me</button>'); 

    button.clicked = false; 

    $('body').append(button); 
    var clicked = false; 

    button.click(function(){ 


     button.clicked = true; 
     button.prop('disabled', true); 
    clicked = true 
    setInterval(function(){ 
     if (clicked) { 
     button.prop('disabled', false); 
     } 
    },10000); 

    }); 


    }); 
    </script> 
    </head> 
    <body> 

    </body> 
    </html>

как только у нажмите кнопку отключить свойство после финиша таймера позволяют вернуть свойство

источник

2016-06-15 09:15:10

Op не просит решение JQuery ... –

общие просто удалить готовый и нажмите, чтобы сделать скрипт вот это надо объяснять, проверьте мой обновленный ответ –

Сплит обработчики событий в двух различных функций (например firstClick и secondClick). Первый обработчик должен просто добавить второго прослушивателя событий и удалить его через 4 секунды. Для этой одноразовой задачи используйте setTimeout вместо setInterval, так как вам нужно выполнить задачу только один раз через 4 секунды и не каждые 4 секунды. Поэтому я хотел бы действовать следующим образом:

var secondClick = function() { 
    // DO WHATEVER YOU WANT TO HAPPEN AFTER THE SECOND CLICK 
} 

var firstClick = function() { 

// DO WHATEVER YOU WANT TO HAPPEN AFTER THE FIRST CLICK 

document.getElementById("buttontimer").addEventListener("click", secondClick); 
setTimeout(function() { 
    document.getElementById("buttontimer").removeEventListener("click", secondClick); 
    }, 4000); 
}; 

buttonElement.addEventListener("click", firstClick);

источник

2016-06-15 09:44:05

Javascript щелкнул и не нажал в течение 4 секунд

ответ

Смежные вопросы