Hallo werte Forengemeinde.
Ich möchte das der Benutzer sowohl die Checkbox bestätigen muss das er die AGB gelesen hat als auch den richtigen Captcha eingibt und erst dann auf eine andere Webseite weiter geleitet wird.
<a href="https://codepen.io/TheBob1/pen/wvBJEvB">https://codepen.io/TheBob1/pen/wvBJEvB</a>
Wäre für jede Hilfe Dankbar.
Besten Dank im Voraus und ein schönes Wochenende
Code
<!doctype html>
<html lang="de">
<head>
<style>
*{
margin:0;
padding:0;
box-sizing:border-box;
}
body{
padding:100px;
}
form{
width:300px;
text-align:center;
}
h3{
padding:10px 0;
}
.unterstrichen{
text-decoration:underline;
}
.capt{
background:grey;
width:100%;
height:100px;
padding:5px 20px;
}
.capt > div ~ div input{
margin:0 10px;
}
#mainCaptcha{
font-size:30px;
font-weight:900;
width:220px;
letter-spacing:10px;
}
#refresh{
width:30px;
height:30px;
background-image: url(rpt.jpg);
}
.capt div{
display:flex;
width:100%;
height:40px;
}
</style>
</head>
<body>
<form>
<h3><input id="field_terms" type="checkbox">
Ich habe die Datenschutzerklärung gelesen und
<span class="unterstrichen">akzeptiere</span> sie!</h3>
<div class="capt">
<div>
<p id="mainCaptcha"></p>
<input type="button" id="refresh" onclick="Captcha();"/>
</div>
<div>
<input type="text" id="txtInput"/>
<input id="Button1" type="button" value="Weiter">
</div>
</div>
</form>
<div id="info"></div>
<script>
function Captcha(){
var alpha = new Array('A','B','C','D','E','F','G','H','J','K','L','M','N','P','Q','R','S','T','U','V','W','X','Y','Z', 'a','b','c','d','e','f','g','h','i','j','k','m','n','o','p','q','r','s','t','u','v','w','x','y','z', '1','2','3','4','5','6','7','8','9');
function rand(){
return Math.floor(Math.random() * alpha.length);
}
document.getElementById("mainCaptcha").innerHTML=alpha[rand()]+alpha[rand()]+alpha[rand()]+alpha[rand()]+alpha[rand()]+alpha[rand()]+alpha[rand()];
}
Captcha()
document.getElementById('Button1').addEventListener('click', function (){
var text;
var inf=document.getElementById('info');
inf.innerHTML='';
var string1 =document.getElementById('mainCaptcha').innerHTML;
var string2 =document.getElementById('txtInput').value;
var check=document.getElementById('field_terms').checked;
if (string1 == string2){
text=true;
inf.innerHTML+="richtiger Text<br>";
}else{
text=false;
inf.innerHTML+="Falsche Eingabe<br>";
}
if(check==false){
inf.innerHTML+="Bitte bestätigen Sie, dass Sie sich mit der Datenschutzerklärung einverstanden erklären.<br>";
}else{
inf.innerHTML+='Checkbox wurde geklickt<br>';
}
if(text==true && check==true){
inf.innerHTML="Weiterleitung erfolgt<br>";
window.location.href = 'https://www.google.de';
}
});
</script>
</body>
</html>