2009-07-22 11 views
1

J'ai 3 .blur et seul le premier fonctionne pour une raison quelconque. voici le code jquery:jQuery .blur ne fonctionne pas

<script type='text/javascript'> 
    $(document).ready(function() { 
     $("#user_name").blur(function() { 
      if ($(this).val().length > 4) { 
       $("#usernamecheckbox").html("<img src='images/checkmark.png' alt='' />"); 
      } else { 
       $("#usernamecheckbox").html("<img src='images/xmark.png' alt='' />"); 
      } 
     }); 
     $("#pass").blur(function() { 
      if ($(this).val().length < 4) { 
       $("#passcheckbox").html("<img src='images/xmark.png' alt='' />"); 
      } 
     }); 
     $("#confirmpass").blur(function() { 
      if ($(this).val() != $("#pass").val()){ 
       $("#passcheckbox").html("<img src='images/xmark.png' alt='' />"); 
      } else { 
       $("#passcheckbox").html("<img src='images/checkmark.png' alt='' />"); 
      } 
     }); 
    }); 
</script> 

et voici la forme:

<form enctype="multipart/form-data" method='post' action='reg.php'> 
    <input type="hidden" name="MAX_FILE_SIZE" value="1000000" /> 
    <p>Username <span class='sub'>must be atleast 4 characters</span></p> 
    <input type='text' name='user_name' id='user_name' /> <div id='usernamecheckbox' class='checkbox'></div><br /> 
    <p>Password <span class='sub'>must be atleast 4 characters</span></p> 
    <input type='password' id='pass' name='pass' /> &nbsp; <input type='password' name='confirm' id='confirmpass' /> <div id='passwordcheckbox' class='checkbox'></div><br /> 
    <p>E-mail <span class='sub'>must be a valid E-mail address</span></p> 
    <input type='text' name='email' id='email' size='40' /> <div id='emailcheckbox' class='checkbox'></div><br /> 
    <p>Avatar</p> 
    <input type='file' name='avatar' /><br /><br /> 
    <?php 
    require_once('recaptchalib.php'); 
    $publickey = "6LdLYwcAAAAAAEeupJKr_IBviIq-xHX5W98IacgZ"; // you got this from the signup page 
    echo recaptcha_get_html($publickey); 
    ?> 
    <br /> 
    <input type='submit' value='Submit'> 
</form> 
+0

vous regardez la longueur> 4 et longueur <4 dans le cas des déclarations que vous obtenez le checkmark.png ou xmark.png pour le premier qui ne fonctionne – amischiefr

+0

bien.? le premier si le contenu a plus de 4 caractères je reçois la coche et si elle n'a pas, alors je reçois le xmark. –

Répondre

11

Avant de prendre le flou() ne fonctionne pas, vous devez le tester avec un code simple, par exemple:

$("#pass").blur(function() { 
      alert('#pass blur triggered'); 
    }); 

Je pense que le problème est que vous cherchez $ ("# passcheckbox"). Je ne vois rien dans votre HTML avec id="passcheckbox". On dirait que vous vouliez dire $ ("#passwordcheckbox").

+5

J'aime toujours les réponses qui fournissent également des conseils de dépannage de base. +1 – Travis

2

Changement #passcheckbox à #passwordcheckbox

Le reste du code semble bien pour moi.

0

Souvent je viens d'ajouter css dans la chaîne de sélecteurs de jquery pour voir si ils ont sélectionné correctement:

$('#passcheckbox').css({'background-color':'red'}).etc();