php - Jquery错误减慢

Question

我的 Jquery 注册验证有问题。如果您不填写名称，我将无法返回错误消息。

jQuery(document).ready(function () {
    $('#register').submit(function () {

        var action = $(this).attr('action');
        var error = '<div class=\"states\"><li class=\"warning\"><strong>Fout!</strong><br /> U hebt geen naam opgegeven.</li> <br /></ul>';

        $(".states li").slideUp(750, function () {
            $('.states li').hide();

            $('#submit')
                .after('<img src="images/ajax-loader.gif" class="loader" />')
                .attr('disabled', 'disabled');


            $.post(action, {
                name: $('#name').val(),
                realname: $('#realnam').val(),
                pass: $('#pass').val(),
                repeatpass: $('#repeatpass').val(),
                mail: $('#mail').val(),
                mailadres: $('#mailadres').val(),
            });

            if (name == "") {
                $(error).slideDown('slow');
            }

        });

        return false;

    });
});

还有我的 HTML 代码：

<script src="js/aanmelden.js"></script>
<?php 
include_once 'include/config.php';
?>

<div class="text-section">
<h1>Aanmelden</h1>
<p>Hier kunt u zich <strong>gratis</strong> aanmelden op <?php echo $sNaam; ?></p>
</div>
<div class="states">
<li class="warning"><strong>Waarschuwing</strong> Deze pagina is (nog) niet af, hier wordt aangewerkt.</li> <br />
</ul>

<form method="POST" action="bin/register.php" id="register">
<fieldset>                 
<legend>Naam</legend>
<label id="username">Gebruikersnaam:</label> 
<input type="text" class="text" name="gebruikersnaam" id="name" placeholder="Uw gebruikersnaam" /> <br />
<label id="realname">Uw echte naam:</label> &nbsp; 
<input type="text" class="text" name="echtenaam" id="realnam" placeholder="Uw echte naam" /> <br />
</fieldset>

<fieldset>
<legend>Wachtwoord</legend>
<label id="password">Uw wachtwoord:</label> &nbsp;    
<input type="password" class="text" id="pass" name="wachtwoord" placeholder="Uw wachtwoord"  /> <br />
<label id="repeatpassword">Uw wachtwoord nogmaals:</label>
<input type="password" class="text" id="repeatpass" name="hwachtwoord" placeholder="Uw wachtwoord nogmaals" /> <br />
</fieldset>

<fieldset>
<legend>Mail</legend>
<label id="mailadres">Uw mail adres:</label> &nbsp; 
<input type="text" class="text" name="mail" id="mail" placeholder="Uw mail adres" /> <br />
<label id="repeatmail">Uw mail adres nogmaals:</label> 
<input type="text" class="text" name="hmail" id="mailadres" placeholder="Uw mail adres nogmaals" /> <br />``
</fieldset>

<input type="submit" name="submit" value="Registreren" class="orange" id="submit" />           
<br />
</form>

我的问题（在http://mijnrpg.eu演示，然后是第二个选项卡）。如果您单击显示“Registreren”的按钮，您将明白我的意思。它没有给出错误。

Answer 1

    $.post(action, {
        name: $('#name').val(),
        realname: $('#realnam').val(),
        pass: $('#pass').val(),
        repeatpass: $('#repeatpass').val(),
        mail: $('#mail').val(),
        mailadres: $('#mailadres').val(),
    });

使用序列化

$('#register').serialize();

你的帖子功能是

$.post(action,
  $('#register').serialize(),
  function(resp)
  {
   ///
  }
);

并回答你的问题尝试

$('#name').val()==''

在这里我稍微修改了你的代码http://jsfiddle.net/eVA8s/10/ 所以基本上你想要做的是创建带有 id error-message 的 div 标签并将它的样式设置为隐藏，第二次看你的标签你有太多没用的标签，第三个总是在firefox中使用firebug，或者在chrome中按f12。

Answer 2

您需要先验证而不是最后验证。更新

    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>

<script type="text/javascript">
jQuery(document).ready(function () { 
$('.error').hide('fast');
$('.warning').hide('fast');
$('.succes').hide('fast');

    $('#register').submit(function () {

            if ($('#name').val() == "") 
{ 
$('.error').slideDown('slow'); return false; 
} 
    else
     {

        var action = $(this).attr('action');

        $(".states li").slideUp(750, function () {
            $('.states li').hide();

            $('#submit')
                .after('<img src="images/ajax-loader.gif" class="loader" />')
                .attr('disabled', 'disabled');


     $.post(action, {
                name: $('#name').val(),
                realname: $('#realnam').val(),
                pass: $('#pass').val(),
                repeatpass: $('#repeatpass').val(),
                mail: $('#mail').val(),
                mailadres: $('#mailadres').val(),
            });

        });

        return false;
    }


    });

});
</script>




<div class="text-section">
<h1>Aanmelden</h1>
<p>Hier kunt u zich <strong>gratis</strong> aanmelden op <?php echo $sNaam; ?></p>
</div>
<div class="states">
  <ul class="states">
    <li class="error"><strong>Fout</strong> Dit zullen ze zien wanneer ze iets fout hebben gedaan.</li>
    <br />
    <li class="warning"><strong>Waarschuwing</strong> Dit zullen ze zien wanneer er een onbekende fout is opgetreden.</li>
    <br />
    <li class="succes"><strong>Goed</strong> Dit zullen ze zien wanneer iets succesvol gegaan is.</li>
  </ul>
</div>

<form method="POST" action="bin/register.php" id="register">
<fieldset>                 
<legend>Naam</legend>
<label id="username">Gebruikersnaam:</label> 
<input type="text" class="text" name="gebruikersnaam" id="name" placeholder="Uw gebruikersnaam" /> <br />
<label id="realname">Uw echte naam:</label> &nbsp; 
<input type="text" class="text" name="echtenaam" id="realnam" placeholder="Uw echte naam" /> <br />
</fieldset>

<fieldset>
<legend>Wachtwoord</legend>
<label id="password">Uw wachtwoord:</label> &nbsp;    
<input type="password" class="text" id="pass" name="wachtwoord" placeholder="Uw wachtwoord"  /> <br />
<label id="repeatpassword">Uw wachtwoord nogmaals:</label>
<input type="password" class="text" id="repeatpass" name="hwachtwoord" placeholder="Uw wachtwoord nogmaals" /> <br />
</fieldset>

<fieldset>
<legend>Mail</legend>
<label id="mailadres">Uw mail adres:</label> &nbsp; 
<input type="text" class="text" name="mail" id="mail" placeholder="Uw mail adres" /> <br />
<label id="repeatmail">Uw mail adres nogmaals:</label> 
<input type="text" class="text" name="hmail" id="mailadres" placeholder="Uw mail adres nogmaals" /> <br />``
</fieldset>

<input type="submit" name="submit" value="Registreren" class="orange" id="submit" />           
<br />
</form>

演示链接