用layui帮我写一个修改密码
时间: 2023-04-08 13:04:17 浏览: 345
好的,以下是使用layui实现修改密码的代码:
HTML代码:
```
<div class="layui-form-item">
<label class="layui-form-label">原密码</label>
<div class="layui-input-inline">
<input type="password" name="oldPwd" required lay-verify="required" placeholder="请输入原密码" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">新密码</label>
<div class="layui-input-inline">
<input type="password" name="newPwd" required lay-verify="required" placeholder="请输入新密码" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">确认密码</label>
<div class="layui-input-inline">
<input type="password" name="confirmPwd" required lay-verify="required" placeholder="请再次输入新密码" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn" lay-submit lay-filter="changePwd">修改密码</button>
</div>
</div>
```
JavaScript代码:
```
layui.use(['form', 'layer'], function(){
var form = layui.form;
var layer = layui.layer;
// 监听修改密码表单提交
form.on('submit(changePwd)', function(data){
// 获取表单数据
var oldPwd = data.field.oldPwd;
var newPwd = data.field.newPwd;
var confirmPwd = data.field.confirmPwd;
// 判断新密码和确认密码是否一致
if (newPwd !== confirmPwd) {
layer.msg('新密码和确认密码不一致');
return false;
}
// 发送修改密码请求
$.ajax({
url: 'changePwd.php',
type: 'POST',
data: {
oldPwd: oldPwd,
newPwd: newPwd
},
success: function(res){
if (res.code === 0) {
layer.msg('修改密码成功');
// 清空表单数据
form.val('changePwdForm', {
oldPwd: '',
newPwd: '',
confirmPwd: ''
});
} else {
layer.msg(res.msg);
}
},
error: function(){
layer.msg('网络错误,请稍后再试');
}
});
return false;
});
});
```
注意:以上代码中的changePwd.php是修改密码的后端接口,需要根据实际情况进行修改。
阅读全文