hiceHice algunas modificaciones, pero creo que logra el resultado que indicás con menos código. (El while no es necesario, porque cada vez que das al botón llamás a la función, no es necesario tener un loop) Al llamar a la función solo verificamos las condiciones y ejecutamos lo deseado.
//Control de acceso
let i = 3; //valor inicial para el número de intentos
function pwcheck() {
const contrasena = document.getElementById("caja").value;
const campoMensaje = document.getElementById("mensaje");
if (contrasena === "acceso" && i > 0) {
campoMensaje.innerHTML = "";
location.href = "okpass.html";
} else if (contrasena !== "acceso" && i >= 1) {
i--;
//Volcamos el error en la caja de aviso
campoMensaje.innerHTML = "Error de acceso, te quedan " + i + " intentos";
document.getElementById("caja").value = "";
document.getElementById("caja").focus().value = "";
}
}
Tal cual dice el comentario, si se desea que esto permanezca bloqueando o descontando incluso si se recarga la página, podrías escribir el valor de la variable en localStorage y leerlo desde ahí. Lo idea sería que ese valor venga desde un server.
Aquí podrás leer sobre localStorage con ejemplos prácticos:
https://developer.mozilla.org/es/docs/Web/API/Window/localStorage
Te dejo un ejemplo de tu código con localStorage, cree algunas funciones y moví alguna cosa para no repetir tanto código o tan largo.
const campoMensaje = document.getElementById("mensaje");
// Creo función para obtener resultado desde localStorage
function getCounter() {
return localStorage.getItem("contador");
}
//Creo función para escribir el valor del contador en localStorage, solo necesita recibir valor como arg.
function setCounter(value) {
return localStorage.setItem("contador", value);
}
if (!getCounter()) {
setCounter(3);
campoMensaje.innerHTML = "";
} else {
campoMensaje.innerHTML =
"Error de acceso, te quedan " + getCounter() + " intentos";
}
function pwcheck() {
const contrasena = document.getElementById("caja").value;
const i = getCounter();
if (contrasena === "acceso" && i > 0) {
campoMensaje.innerHTML = "";
setCounter(3);
location.href = "okpass.html";
} else if (contrasena !== "acceso" && i >= 1) {
setCounter(getCounter() - 1);
//Volcamos el error en la caja de aviso
campoMensaje.innerHTML = "Error de acceso, te quedan " + getCounter() + " intentos";
document.getElementById("caja").value = "";
document.getElementById("caja").focus().value = "";
}
}
Si quieres volver a iniciar de cero la cuenta esto sucede cuando el usuario se loguea correctamente o cuando borras manualmente localStorage.