Что касается логики, то решений может быть туева туча. Вот два примера и оба это один скрипт, можете их запустить на локальном сервере под любым именем.
1) Согласно условиям ранее оговоренным:
<?
session_start();
//обработка запросов
if($_POST) {
switch($k = key($_POST)) {
case 'check': $out = $_SESSION['check']==(int)$_POST[$k] ? '' : 'Завтра в школу с родителями!';
break;
case 'text': $out = 'Ok';
}
exit($out);
}
//каптча
$a = ['+','-','*'];
shuffle($a);
$check = rand(1, 10) . $a[0] . rand(1, 10);
eval('$_SESSION[check]='.$check.';');
?>
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$('button').click(function() {
$.post(location, {check: $(this).prev().val()}, function(d) {
if(!d) $('form').submit();
else alert(d);
})
});
$('form').submit(function(e) {
e.preventDefault();
$.post(location, $(this).serialize(), function(d) {
alert(d)
})
});
});
</script>
</head>
<body>
<form>
<input name="text" value="Text" />
</form>
<span>Сколько: <?=$check?>=?</span>
<input name="check" />
<button>Проверка</button>
</body>
</html>
Но при таком решении затруднительно обновлять каптчу при ошибках и после приема формы. Но достаточно генерацию каптчи сделать функцией, которую можно размещать хоть до обработки запросов, хоть после, эту задачу легко решить.
2) Генерация каптчи функцией и обмен с сервером в формате JSON.
<?
session_start();
//каптча
function check() {
$a = ['+','-','*'];
shuffle($a);
$check = rand(1, 10) . $a[0] . rand(1, 10);
eval('$_SESSION[check]='.$check.';');
return $check;
}
//обработка запросов
if($_POST) {
switch($k = key($_POST)) {
case 'check': $out = $_SESSION['check']==(int)$_POST[$k] ? '' : ['err'=>1, 'exp'=>check(), 'msg'=>'Двойка! Завтра в школу с родителями!'];
break;
case 'text': $out = ['exp'=>check(), 'msg'=>'Ok!'];
}
exit(json_encode($out));
}
?>
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$('button').click(function() {
var f = $(this).prev();
$.post(location, {check: f.val()}, function(d) {
if(!d.err) $('form').submit();
else {
$('span').text(d.exp);
f.val('');
alert(d.msg);
}
}, 'json')
});
$('form').submit(function(e) {
e.preventDefault();
$.post(location, $(this).serialize(), function(d) {
$('span').text(d.exp);
$('[name="check"]').val('');
alert(d.msg);
}, 'json')
});
});
</script>
</head>
<body>
<form>
<input name="text" value="Text" />
</form>
<label>Сколько: <span><?=check()?></span>=?</label>
<input name="check" />
<button>Проверка</button>
</body>
</html>