Javascript jQuery验证：表单始终有效问题

我正在尝试在提交到服务器之前执行表单验证。我正在使用jquery.validate插件 () 我所面临的问题是，不管我在表单字段中键入什么，验证总是成功的，我通过网络对文档和样本进行了双重检查，看不出为什么会出现这种行为。 此表单通过jquery ajax加载：

$.ajax({
    url: "mypage.php",
    type: "POST",
    cache: false,
    success: function(cont){
        $("body").append(cont);
    }
});

这里我向您展示mypage.php代码

<script src="js/jquery.validate.min.js"></script>
<script type="text/javascript">

$(document).ready(function () {

    $("#frmParticipante").validate({
        rules: { 
            nombre: {  required: true  } ,
            email: { required: true, email: true },
            ci: { required: true}
        }
    });

    $("#frmParticipante").submit(function(e){
        e.preventDefault();  
        if($(this).valid()){
            loadpop("ganaste.php");
        }
    else
        loadpop("perdiste.php");    

    });
});


</script>

<div id="pop_terminaste" class="pop_mensaje ingresardatos animated fadeInDown">
    <div id="infopop">
        <div id="lady"> <img src="images/terminaste1.jpg" width="453" height="626" /> </div>
        <div id="dato">
            <p class="txt1">¡Terminaste la trivia!</p>
            <p class="txt2">Ahora solo te falta completar tus datos para conocer el resultado.</p>
            <p class="txt3">Si ha cargado anteriormente sus datos, ingresar solo su cédula.</p>
            <form action="" id="frmParticipante" class="form">
                <fieldset>
                    <label for="nombre"><img src="images/ico_nombre.png" alt="ico_nombre" /></label>
                    <input type="text" placeholder="Nombre y Apellido" id="nombre">
                </fieldset>
                <fieldset>
                    <label for="email"><img src="images/ico_email.png" alt="ico_email" /></label>
                    <input type="text" placeholder="Email" id="email">
                </fieldset>
                <fieldset>
                    <label for="ci"><img src="images/ico_ci.png" alt="ico_ci" /></label>
                    <input type="text" placeholder="C.I" id="ci">
                </fieldset>
                <p class="msg error">Favor verificar los datos ingresados.</p>                
                <input type="submit" value="VER RESULTADOS" />                    
            </form>
        </div>
    </div>
</div>

$（文档）.ready（函数（）{
$（“#frmParticipante”）。验证({
规则：{
nombre:{required:true}，
电子邮件：{required:true，email:true}，
ci:{required:true}
}
});
$（“#frmParticipante”）。提交（功能（e）{
e、 预防默认值（）；
if（$（this）.valid（））{
loadpop（“ganaste.php”）；
}
其他的
loadpop（“perdiste.php”）；
});
});
“终止琐事
一个人完成了一项新的任务
这是卡加多·安格里尔·索洛·苏塞杜拉（Ingrear solo su cédula）的拿督

---

谢谢

我确信验证库需要名称属性，而不需要注意id属性。您应该将id attr更改为name，或者只添加具有相同值的name属性……例如：

<input type="text" placeholder="Nombre y Apellido" id="nombre" name="nombre">

这里有一把小提琴来证明它是有效的

除了名称之外，您可能还需要将validate.js库加载到正在加载表单的页面头部，然后在ajax请求中运行validate in.done（）

<script>
$.ajax({
    url: "mypage.php",
    type: "POST",
    cache: false
}).done(function(cont) {
    $("body").append(cont);
    $("#frmParticipante").validate({
        rules: { 
            nombre: {  required: true  } ,
            email: { required: true, email: true },
            ci: { required: true}
        }
    });
});
$("#frmParticipante").submit(function(e){
    e.preventDefault();  
    if($(this).valid()){
        loadpop("ganaste.php");
    }
    else
        loadpop("perdiste.php");    
});
</script>

$.ajax({
url:“mypage.php”，
类型：“POST”，
缓存：false
}).完成（功能（续）{
$（“正文”）。追加（续）；
$（“#frmParticipante”）。验证({
规则：{
nombre:{required:true}，
电子邮件：{required:true，email:true}，
ci:{required:true}
}
});
});
$（“#frmParticipante”）。提交（功能（e）{
e、 预防默认值（）；
if（$（this）.valid（））{
loadpop（“ganaste.php”）；
}
其他的
loadpop（“perdiste.php”）；
});

---

再次…确保验证库已加载到您要将ajax内容加载到的页面上…在ajax内容到达之前，它必须在页面上。

您的第一个jQuery代码示例

“mypage.php

缺少结尾

”

。您需要

返回false

在

$（“#frmParticipante”）。提交
以阻止表单提交。@KhanhTO或
e.preventDefault（）
Sébastien关于“mypage.php”你是对的，在这里键入KhanhTO时这是一个错误，我使用e.preventDefault（）进行了测试，结果相同，将该行放在那里不会改变结果，表单正在通过验证。谢谢Skevindeleon，尝试了你的建议，但没有起作用，结果相同。谢谢你竖起一把小提琴或给出一个示例URL，这样我们就可以帮助你了，干杯。我竖起一把小提琴，如果你像我说的那样加上名字，对我来说效果很好。我能想到的另一件事是，这是文档的时间问题。准备好了吗，当您从ajax中提取表单时……当验证库进行初始化时，表单可能不在页面上。嘿，kevin，我刚刚测试并注意到了同样的问题，如果问题是时间的问题，我想我必须摆脱插件并手动验证。你还有别的建议吗？非常感谢