¿Cómo escribir la función de modificación de contraseña de front-end con jQuery? Grabarlo

Ideas:
1. Si desea modificar la contraseña, primero debe ingresar la contraseña original, por lo que el primer paso es obtener la contraseña original y luego verificarla para ver si es correcta. Si es incorrecta, dé un mensaje .
2. Cuando la contraseña original se ingresa correctamente, puede ingresar la nueva contraseña, luego la nueva contraseña debe tener ciertas reglas de entrada, como ingresar de 6 a 18 dígitos, como letras o números o símbolos especiales, que deben basarse en usted Las necesidades específicas están determinadas. Si la contraseña ingresada por el usuario no cumple con las reglas que especificó, se le dará un mensaje.
3. Cuando la nueva contraseña cumpla con los requisitos, debe ingresarla nuevamente para confirmar la contraseña. De la misma manera, debe determinar si la contraseña ingresada es consistente con la que ingresó hace un momento. Si es inconsistente, debe tengo que dar un aviso.
4. Cuando toda la entrada esté completa, puede hacer clic en el botón Guardar para enviar.
5. También debe tenerse en cuenta que cuando el usuario solo ingresa una parte del contenido, o no se ingresa nada, haga clic en el botón Guardar y debe preguntarle al usuario.
Probablemente la idea sea así, no digas tonterías a continuación, solo mira el código.

<tbody>
	<tr>
		<td class="td_left">旧密码 </td>
		<td class="td_right"><input type="password" id="oldpassword" name="oldpassword" placeholder="请输入原密码">
			<div style="display: inline" id="tip1"></div>
		</td>
	</tr>
	<tr>
		<td class="td_left">新密码 </td>
		<td class="td_right"><input type="password" id="password1" name="password1" placeholder="请输入6到18位新密码">
			<div style="display: inline" id="tip2"></div>
		</td>
	</tr>
	<tr>
		<td class="td_left">新密码确认 </td>
		<td class="td_right"><input type="password" name="password2" id="password2" placeholder="请再次输入新密码" />
			<div style="display: inline" id="tip3"></div>
		</td>
	</tr>
</tbody>

/* 旧密码输入框失去焦点时 */
	$("#oldpassword").blur(function() {
    
    
		var param = $("#oldpassword").val();
		/* 用ajax验证是否和原来的旧密码相同 */
		$.ajax({
    
    
			url: "../../data/login-data.json",
			async: false,
			type: "get",
			dataType: "json",
			success: function(data) {
    
    
				$.each(data, function(i, item) {
    
    
					if (param == item["password"]) {
    
    
						$("#tip1").html("<span>密码输入正确</span>").css({
    
    'color':'green','marginLeft':'15px'});
					} else {
    
    
						$("#tip1").html("<span >密码输入错误</span>").css({
    
    'color':'red','marginLeft':'15px'});
					}
				});
			}
		});
	});
	/* 输入新密码 */
	$("#password1").blur(function() {
    
    
		var num = $("#password1").val().length;
		if (num < 6) {
    
    
			$("#tip2").html("<span>密码太短，请重新输入</span>").css({
    
    'color':'red','marginLeft':'15px'});
		} else if (num > 18) {
    
    
			$("#tip2").html("<span>密码太长，请重新输入</span>").css({
    
    'color':'red','marginLeft':'15px'});
		} else {
    
    
			$("#tip2").html("<span>验证通过</span>").css({
    
    'color':'green','marginLeft':'15px'});
		}
	});
	/* 再次输入新密码 */
	$("#password2").blur(function() {
    
    
		var tmp = $("#password1").val();
		var num = $("#password2").val().length;
		if ($("#password2").val() != tmp) {
    
    
			$("#tip3").html("<span>两次密码输入不一致，请重新输入</span>").css({
    
    'color':'red','marginLeft':'15px'});
		} else {
    
    
			if (num >= 6 && num <= 18) {
    
    
				$("#tip3").html("<span>验证通过</span>").css({
    
    'color':'green','marginLeft':'15px'});
			} else {
    
    
				$("#tip3").html("<span>验证不通过，无效</span>").css({
    
    'color':'red','marginLeft':'15px'});
			}
		}
	});

	/* 绑定保存按钮的点击事件 */
	$(".change").click(function() {
    
    
		
		var flag = true;
		var old = $("#oldpassword").val();
		var pass = $("#password1").val();
		var pass2 = $("#password2").val();
		var num1 = $("#password1").val().length;
		var num2 = $("#password2").val().length;
		if (num1 != num2 || num1 < 6 || num2 < 6 || num1 > 18 || num2 > 18 || pass != pass2) {
    
    
			flag = false;
		} else {
    
    
			flag = true;
		}
		if (flag) {
    
    
			$("#tip4").show().html("<span>保存成功</span>").css({
    
    'color':'green','marginLeft':'100px','marginTop':'20px'});
			$("#oldpassword").val("");
			$("#password1").val("");
			$("#password2").val("");
			$("#tip1").empty();
			$("#tip2").empty();
			$("#tip3").empty();
			$("#tip4").delay(2000).hide(0);
		} else {
    
    
			if($('#oldpassword').val().length == 0 || $('#password1').val().length == 0 || $('#password2').val().length == 0){
    
    
				$("#tip4").show().html("<span>输入信息不完整，请重输入</span>").css({
    
    'color':'red','marginLeft':'100px','marginTop':'20px'});
			}else{
    
    
				$("#tip4").show().html(
					"<span>输入有误，请重新输入</span>").css({
    
    'color':'red','marginLeft':'100px','marginTop':'20px'});
			}
			
		}
	});

El contenido de este artículo se tomó prestado del siguiente artículo, y el enlace original se adjunta
https://blog.csdn.net/exceptional_derek/article/details/19198101