Este es mi código de script para la generación de captcha:
var allValue = ['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y', 'Z','1','2','3','4','5','6','7','8','9','0',]; var cVal1 = allValue[Math.floor(Math.random()*allValue.length)]; var cVal2 = allValue[Math.floor(Math.random()*allValue.length)]; var cVal3 = allValue[Math.floor(Math.random()*allValue.length)]; var cVal4 = allValue[Math.floor(Math.random()*allValue.length)]; var cVal5 = allValue[Math.floor(Math.random()*allValue.length)]; var cVal6 = allValue[Math.floor(Math.random()*allValue.length)]; var cValue = cVal1+cVal2+cVal3+cVal4+cVal5+cVal6; captchaValue.innerHTML = cValue; thisValue = ""; captcha_code.addEventListener('change',function(){ thisValue = captcha_code.value; }) submitBtn.addEventListener('click',function(){ if(cValue == thisValue){ alert('Valid'); }else if(captcha_code.value == ""){ alert('Invalid Captcha'); } })Este es mi código html para captcha dentro del formulario:
<label for="exampleInputEmail1" class="form-label">Captcha</label> <div class="captcha"> <div id="captchaValue"></div> <input type="text" name="captcha_code" class="form-control" id="captcha_code" placeholder="" /> </div> <a href="/">New Captcha</a>Cómo obtener un nuevo captcha cada vez que hago clic en el botón 'Nuevo Captcha'.
Puede deshabilitar la recarga de la página configurando el atributo href en href="javascript:; Luego, coloque el código que genera el nuevo captcha en una función y llámelo cada vez que haga clic en el enlace. Puede crear esto usando el detector de eventos .
var allValue = ['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y', 'Z','1','2','3','4','5','6','7','8','9','0',]; function newCaptcha() { var cVal1 = allValue[Math.floor(Math.random() * allValue.length)]; var cVal2 = allValue[Math.floor(Math.random() * allValue.length)]; var cVal3 = allValue[Math.floor(Math.random() * allValue.length)]; var cVal4 = allValue[Math.floor(Math.random() * allValue.length)]; var cVal5 = allValue[Math.floor(Math.random() * allValue.length)]; var cVal6 = allValue[Math.floor(Math.random() * allValue.length)]; var cValue = cVal1 + cVal2 + cVal3 + cVal4 + cVal5 + cVal6; captchaValue.innerHTML = cValue; } newCaptcha(); document.querySelector("#new_captcha").addEventListener("click", newCaptcha); thisValue = ""; captcha_code.addEventListener("change", function () { thisValue = captcha_code.value; }); <label for="exampleInputEmail1" class="form-label">Captcha</label> <div class="captcha"> <div id="captchaValue"></div> <input type="text" name="captcha_code" class="form-control" id="captcha_code" placeholder="" /> </div> <a id="new_captcha" href="javascript:;" >New Captcha</a>