valor - mostrar resultado en input javascript
Establecer una matriz para seleccionar diferentes variables onclick (3)
Tengo una pequeña configuración experimental que estoy editando para crear un div que aparece en momentos aleatorios y cuando lo haces, desaparece. Tengo problemas al forzar que la variable "x" sea un número diferente al conjunto cada vez que se hace clic en él. En cambio, elegirá un número de la matriz al comienzo y se quedará con él todo el tiempo.
DIV:
<div id="div" onclick="hide()" style="visibility:hidden;">Doge</div>
JS:
<script type = "text/javascript">
var interval = [5000, 1000, 10000, 6000, 500];
var x = interval[Math.floor(Math.random() * interval.length)];
setInterval(function(){
document.getElementById(''div'').style.visibility = "visible";
},x);
function hide(){
document.getElementById(''div'').style.visibility = "hidden";
var x = interval[Math.floor(Math.random() * interval.length)];
}
</script>
Cada vez que haces clic en el div quiero que vuelva a aparecer en un intervalo de tiempo diferente.
El problema es con su número de generación aleatorio, la mayoría de las veces está repitiendo el mismo valor una y otra vez.
Enlace de su salida de generación de números aleatorios
Intenta resolver esto y vuelve a intentarlo.
setInterval
toma un valor de delay
y lo usa para cada intervalo. No se ve afectado por la actualización de la variable. Lo que quiere es setTimeout
, que establecerá cada vez que se llame a su función hide
.
var interval = [5000, 1000, 10000, 6000, 500];
var div = document.getElementById(''div'');
function hide(){
div.style.visibility = "hidden";
showIn(randomInterval());
}
function randomInterval() {
return interval[Math.floor(Math.random() * interval.length)];
}
function showIn(delay) {
setTimeout(function() {
div.style.visibility = "visible";
}, delay);
}
// call directly in the beginning to show the div
showIn(randomInterval());
<script type = "text/javascript">
var interval = [5000, 1000, 10000, 6000, 500];
var x = interval[Math.floor(Math.random() * interval.length)];
setInterval(function(){
document.getElementById(''div'').style.visibility = "visible";
},x);
function hide(){
document.getElementById(''div'').style.visibility = "hidden";
var x = interval[Math.floor(Math.random() * interval.length)];
setInterval(function(){
document.getElementById(''div'').style.visibility = "visible";
},x);
}
</script>