我有以下代码：
var onLoadRecaptcha = function () {
$('form').each(function (id, el) {
$(el).ready(function () {
var submit = function () {
$(el).submit();
}
grecaptcha.render(
$(el).find('.recaptcha').get(0),
{
'sitekey': '6LeDwBoUAAAAANMD7VBNK2F2agKXl6rduUlelf5U',
'callback': submit,
'size': 'invisible'
}
);
});
});
}
$(function () {
$('form').each(function (id, el) {
$(el).find('button').click(function () {
grecaptcha.execute();
});
$(el).submit(function (event) {
event.preventDefault();
var _data = $(this).serialize();
$.ajax({
type: 'POST',
url: $(this).attr('action'),
data: _data
})
.done(function(response) {
alert(response);
notifySuccess("Já recebemos sua história! Obrigado por compartilhá-la conosco!");
$(el).find('textarea').val(' ');
})
.fail(function(data) {
notifyAlert(data.responseText);
});
});
});
});
我正在使用Google的reCaptcha，基本上我认为我的网站中的每个表单（基本上都是相同表单的列表）在通过AJAX提交表单之前执行验证码。虽然它的工作原理是每个表单按钮都调用reCaptcha窗口，但在解决了reCatpcha之后，按下哪个按钮并不重要，它始终是提交的第一个表单。
就像第5行的$(el).submit()每次都返回第一个表单而不是迭代的当前表单（el）。
修改：根据要求，我附上 index.php 文件：
<!doctype html>
<?php
// error_reporting(0);
require_once('scripts/connect.php');
//require_once('scripts/fb.php');
$res = mysqli_query($mysqli, "SELECT * FROM `personas`");
?>
<html class="no-js" lang="pt-BR">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Campanha Anti-bullying | UNASP-EC</title>
<meta name="description" content="Uma campanha anti-bullying bem bacaninha">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">
<link href="https://fonts.googleapis.com/css?family=Oswald:300,400" rel="stylesheet">
<link href="style.css" rel="stylesheet">
<!--[if lt IE 9]>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js"></script>
<script>window.html5 || document.write('<script src="js/vendor/html5shiv.js"><\/script>')</script>
<![endif]-->
</head>
<body>
<!--[if lt IE 8]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<section>
<div class="fill-viewport cover d-flex flex-column justify-content-center align-items-center text-uppercase container" style="background-color: #000; color: #FFF">
<img class="img-fluid" src="images/cover_text.png" alt="Bullying, esta brincadeira não tem graça!" />
</div>
</section>
<section> <!-- Apresentação -->
<div class="container my-5 text-justify stylize-text">
<p>O sol queimava, mas dentro da menina magra e de cabelos crespos existia uma tempestade provinda do Alasca. O céu se estendia num azul pintado de anil, porém, a menina tímida de pequeno porte, o enxergava cinza. Os pássaros cantavam, no entanto, a menina de óculos e pele negra ouvia apenas um tom dissonante. Talvez hoje o som seja algo semelhante ao da trilha de Bernard Herrmann no filme Psicose.</p>
<p>— Mãe, me dá R$0,50? — perguntou a pequena de oito anos.</p>
<p>— Por que você quer esse dinheiro? — retrucou a mãe desconfiada.</p>
<p>— Por nada mãe, eu só quero — respondeu, agora com os olhos lacrimejados.</p>
<p>A mãe não tinha ideia do que acontecia e atordoada com os fatos relatados pela filha, se viu sem forças para continuar o caminho tortuoso até a escola.</p>
<p>— Mãe ela me bate quando não dou o dinheiro e todos os dias eles me xingam e me deixam sozinha no recreio.</p>
<p>O trecho acima poderia ser facilmente confundido com aquelas histórias ficcional, não fosse um fato vivido por 46,6% dos alunos entrevistados pelo Instituto Brasileiro de Geografia e Estatística (IBGE). O último senso confirmou o crescimento significativo desde o último levantamento feito em 2012, onde apontou 35,3% o número de vítimas nas escolas. De acordo com a pesquisa, 7,4% dos entrevistados atribuíram a aparência como principal motivo para as agressões.</p>
<p>De acordo com o Código Civil Brasileiro, o <i>bullying</i> é crime e resulta em pena ao agressor, podendo ser advertência ou até mesmo restrição de liberdade. Alessandra Borelli, advogada e coordenadora do <i>Manual de Boas Práticas para Uso Seguro das Redes Sociais</i> da Ordem dos Advogados do Brasil de São Paulo (OAB/SP) e coordenadora do guia <i>Conhecendo para Prevenir bullying< e Cyberbullying</i>, explica as consequências de causar dano moral ou físico ao outro e lembra ser obrigação do agressor, dos pais ou até mesmo da escola reparar a ofensa. “Logo, se um menor for responsável pela prática de <i>bullying</i>, muito embora a legislação privilegie a adoção de medidas voltadas à orientação e resgate da boa disciplina, nada impede que a vítima do <i>bullying</i> promova medidas legais buscando a reparação dos danos suportados”, destaca. Ainda de acordo com Alessandra é responsabilidade de todos, família e escola, prestar ajuda necessária a vítimas de <i>bullying</i>, com o intuito de aliviar as consequências da agressão. “Considerando os aspectos morais que alicerçam as relações entre pais e filhos, alunos, escola e sociedade em geral, todos somos responsáveis e se, ao notarmos sinais de vítimas ou agressores em nossos filhos e alunos, devemos agir tempestivamente. Famílias e escolas precisam caminhar juntas”, pontua.</p>
<p>O Centro Universitário Adventista de São Paulo (Unasp), campus Engenheiro Coelho, entende o <i>bullying</i> como um problema real na vida de crianças e jovens e por esse motivo, aderiu à campanha “Essa brincadeira não tem graça”, com o objetivo de conscientizar vítimas e agressores, alunos de escolas e universidades públicas e privadas para a luta contra o <i>bullying</i>.</p>
</div>
</section>
<section> <!-- Imprensa -->
<div class="container py-5">
<h1>Imprensa</h1>
</div>
</section>
<section> <!-- Eu Cuido de Você -->
<div class="container py-5">
<h1>Eu Cuido de Você</h1>
<p class="text-justify stylize-text">Você acompanhou histórias reais de brincadeiras sem graça, mas isso não precisa continuar. Nós entendemos o momento difícil e delicado que envolve uma agressão, mas você deve saber que não está sozinho. O Unasp preparou uma equipe de psicólogos para te ajudar. Tudo o que você precisa fazer é nos contar sua história. Fique a vontade e desabafe nos comentários abaixo sobre o que você enfrenta em seu dia-a-dia. Fique tranquilo, pois não vamos contar para ninguém. Queremos cuidar de você!</p>
<ul class="list-unstyled form-list">
<?php while ($persona = $res->fetch_array(MYSQLI_ASSOC)) { ?>
<li class="card card-inverse rounded-0 mb-4" style="background-color: #333;">
<div class="card-block">
<form id="story-<?php echo $persona['id']; ?>" action="scripts/story_submit.php" method="post" class="h-100">
<input name="id" type="hidden" value="<?php echo $persona['id']; ?>" />
<div class="d-flex form-body">
<div class="d-flex flex-column">
<img src="./images/personas/<?php echo $persona['image'] ?>" alt="" />
<span class="persona-caption"><?php echo $persona['name']; ?></span>
</div>
<div class="d-flex flex-column w-100">
<textarea name="story" class="form-control" maxlength="500" required></textarea>
<button type="button" class="btn btn-primary">Enviar</button>
</div>
<div class="recaptcha"></div>
</div>
</form>
</div>
</li>
<?php } ?>
</ul>
</div>
</section>
<!-- Notify Modal -->
<div class="modal fade" id="notify-modal" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog " role="document">
<div class="modal-content">
<div class="modal-body alert mb-0">
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script>
<script src="script.js"></script>
<script src="https://www.google.com/recaptcha/api.js?onload=onLoadRecaptcha&render=explicit" async defer></script>
</body>
</html>
<?php
$res->free();
$mysqli->close();
?>
如果需要，您还可以查看有问题的网站here。