Javascript密码更改表单验证在IE8上不起作用

Question

从更改的密码形式中获得了此功能来验证两个字段，并且在IE8上似乎不起作用。 FF，Opera，Safari和Chrome可以正常工作。

function chk_form_pw()
{
 if(document.getElementById('new_passwd').value == '')
 {
  alert("<?php _e('Please enter New Password') ?>");
  document.getElementById('new_passwd').focus();
  return false;
 }
 if(document.getElementById('new_passwd').value.length < 5 )
 {
  alert("<?php _e('Please enter New Password minimum 5 chars') ?>");
  document.getElementById('new_passwd').focus();
  return false;
 }
 if(document.getElementById('cnew_passwd').value == '')
 {
  alert("<?php _e('Please enter Confirm New Password') ?>");
  document.getElementById('cnew_passwd').focus();
  return false;
 }
 if(document.getElementById('cnew_passwd').value.length < 5 )
 {
  alert("<?php _e('Please enter Confirm New Password minimum 5 chars') ?>");
  document.getElementById('cnew_passwd').focus();
  return false;
 }
 if(document.getElementById('new_passwd').value != document.getElementById('cnew_passwd').value)
 {
  alert("<?php _e('New Password and Confirm New Password should be same') ?>");
  document.getElementById('cnew_passwd').focus();
  return false;
 }
}

形式如下：

<form name="registerform" id="registerform" action="<?php echo get_option( 'siteurl' ).'/?page=account&chagepw=1'; ?>" method="post">
<p><label><?php _e('New Password'); ?> <span class="indicates">*</span></label></p>
<p><input type="password" name="new_passwd" id="new_passwd"  class="lostpass_textfield" /></p>
<p><label><?php _e('Confirm New Password'); ?> <span class="indicates">*</span></label></p>
<p><input type="password" name="cnew_passwd" id="cnew_passwd"  class="lostpass_textfield" /></p>
<p><input type="submit" name="Update" onclick="return chk_form_pw();" value="<?php _e('Update Password') ?>" class="btn grey"/></p>
</form>

这是chagepw = 1的事情：

<?php
if($_POST)
{
    if($_REQUEST['chagepw'])
    {
        $new_passwd = $_POST['new_passwd'];
        if($new_passwd)
        {
            $user_id = $current_user->data->ID;
            wp_set_password($new_passwd, $user_id);
            $message1 = "Password Changed successfully.You need to sign back in.";
        }

    }else
    {
        $user_id = $userInfo['ID'];
        $user_add1 = $_POST['user_add1'];
        $user_add2 = $_POST['user_add2'];
        $user_city = $_POST['user_city'];
        $user_state = $_POST['user_state'];
        $user_country = $_POST['user_country'];
        $user_postalcode = $_POST['user_postalcode'];

        $buser_add1 = $_POST['buser_add1'];
        $buser_add2 = $_POST['buser_add2'];
        $buser_city = $_POST['buser_city'];
        $buser_state = $_POST['buser_state'];
        $buser_country = $_POST['buser_country'];
        $buser_postalcode = $_POST['buser_postalcode'];
        $user_address_info = array(
                            "user_add1"     => $user_add1,
                            "user_add2"     => $user_add2,
                            "user_city"     => $user_city,
                            "user_state"    => $user_state,
                            "user_country"  => $user_country,
                            "user_postalcode"=> $user_postalcode,
                            "buser_name"    => $_POST['buser_fname'].'  '.$_POST['buser_lname'],
                            "buser_add1"    => $buser_add1,
                            "buser_add2"    => $buser_add2,
                            "buser_city"    => $buser_city,
                            "buser_state"   => $buser_state,
                            "buser_country" => $buser_country,
                            "buser_postalcode"=> $buser_postalcode,
                            );
        update_usermeta($user_id, 'user_address_info', serialize($user_address_info)); // User Address Information Here
        $userName = $_POST['user_fname'].'  '.$_POST['user_lname'];
        $updateUsersql = "update $wpdb->users set user_nicename=\"$userName\", display_name=\"$userName\"  where ID=\"$user_id\"";
        $wpdb->query($updateUsersql);
        $message = "Information Updated successfully.";
    }
}
$userInfo = $General->getLoginUserInfo();
$user_address_info = unserialize(get_user_option('user_address_info', $user_id));
$user_add1 = $user_address_info['user_add1'];
$user_add2 = $user_address_info['user_add2'];
$user_city = $user_address_info['user_city'];
$user_state = $user_address_info['user_state'];
$user_country = $user_address_info['user_country'];
$user_postalcode = $user_address_info['user_postalcode'];
$display_name = $userInfo['display_name'];
$display_name_arr = explode(' ',$display_name);
$user_fname = $display_name_arr[0];
$user_lname = $display_name_arr[2];
$buser_add1 = $user_address_info['buser_add1'];
$buser_add2 = $user_address_info['buser_add2'];
$buser_city = $user_address_info['buser_city'];
$buser_state = $user_address_info['buser_state'];
$buser_country = $user_address_info['buser_country'];
$buser_postalcode = $user_address_info['buser_postalcode'];
$bdisplay_name = $user_address_info['buser_name'];
$display_name_arr = explode(' ',$bdisplay_name);
$buser_fname = $display_name_arr[0];
$buser_lname = $display_name_arr[2];

if($_SESSION['redirect_page'] == '')
{
    $_SESSION['redirect_page'] = $_SERVER['HTTP_REFERER'];
}
if(strstr($_SESSION['redirect_page'],'page=checkout'))
{
    $login_redirect_link = get_option( 'siteurl' ).'/?page=checkout';
}
?>  

Answer 1

一个更平滑的解决方案是jQuery。 在那里，您可以加载加载动画，在错误/正确的位置上放置红色/绿色（如红色/绿色），并根据表单的内容来简化打印输出文本。

从以下位置下载jQuery： http : //docs.jquery.com/Downloading_jQuery

然后将其插入html代码中，如下所示：

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

然后，您可以拥有一个validate.js，如下所示：

  $(document).ready(function () {
  var validatefield = $('#validatefield');
  $('#validatefield').keyup(function () {
   var t = this; 
 if (this.value != this.lastValue) {
  if (this.timer) clearTimeout(this.timer);
  validatefield.html('<img src="images/Here_you_can_put_your_gif_animation" 

  alt="Loading..." 
  height="16" width="16"/>');

  this.timer = setTimeout(function () {
    $.ajax({

      url: 'check_field.php',
      data: 'action=check_field&field=' + encodeURIComponent(t.value),
      dataType: 'json',
      type: 'post',
 success: function (j) {
    if (j.ok) { 
            validatefield.html(j.msg); 
    }
    else if ($("#validatefield").val() == "")
    {       
    validatefield.html('');
    }

    else { 
         validatefield.html(j.msg);
    }
     }
    });
  }, 200);

  this.lastValue = this.value;
}
});
});

然后在check_field.php中，有这个；

echo json_encode(check_field($_POST['field']));

function check_field($field) {
$fieldSum = stripslashes(strip_tags(trim(htmlspecialchars($field)))); 
$response = array(); 

if (strlen($fieldSum) > 15) {
 $response = array(
   'ok' => false, 
   'msg' => "The field characters were over 15!");      
} 
 else 
      {
$response = array(
  'ok' => true, 
  'msg' => "Correct");
}
return $response;        
}

id #validatefield是要打印出来的html代码中的id。

例：

<div id="validatefield">Here comes the text etc, from the valid.js</div>

Answer 2

最终使用之前发布的JQuery脚本完成了该操作：

http://code.google.com/p/form-validation-engine/downloads/list

适应我以前的代码真的很容易，并且在所有经过测试的浏览器中都可以完美工作。

谢谢大家的帮助！