检查密码是否匹配

Check if Passwords Match

本文关键字:是否 密码 检查      更新时间:2023-09-26

在让用户继续之前,如何确保密码字段匹配?

<input name="pass" id="pass" type="password" />
<input type="password" name="cpass" id="cpass" /> <span id='message'></span>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$('#pass, #cpass').on('keyup', function () {
if ($('#pass').val() == $('#cpass').val()) {
    $('#message').html('Matching').css('color', 'green');     
} 
else $('#message').html('Not Matching').css('color', 'red'); 
});
 </script>
<input type="text" name="phone" id="phone">

使用 jquery,您可以删除电话输入的 disable 属性:

<input type="text" name="phone" id="phone" disabled />
$('#pass, #cpass').on('keyup', function () {
if ($('#pass').val() == $('#cpass').val()) {
    $('#message').html('Matching').css('color', 'green');
    $("#phone").prop('disabled', false);    
} 
else $('#message').html('Not Matching').css('color', 'red'); 
});

您可以通过将属性disabled添加到电话字段的输入来根据条件启用禁用文本框:

$('#pass, #cpass').on('keyup', function () {
  if ($('#pass').val() == $('#cpass').val()) {
   $('#message').html('Matching').css('color', 'green'); 
   $("#phone").removeAttr("disabled"); 
  } 
 else {
   $('#message').html('Not Matching').css('color', 'red'); 
   $("#phone").attr("disabled", "disabled"); 
  }
 });

工作演示