点击表单电子邮件字段中的“忘记”按钮应该使用我的代码下面的jquery进行验证,如果有任何错误建议我并浏览登录页面图像
<form id="form1" name="form1" action="<?php echo base_url(); ?>Index.php/Login_cntrl/login" method="POST" >
<div class="field-wrap">
<label class="view-label"for="email">Name (required, at least 2 characters)</label>
<input type="email" placeholder="Email Address" name="email" id="email" class="input-control" value="<?php echo set_value('email'); ?>" />
<span class="text-danger"><?php echo form_error('email'); ?></span>
</div>
<div class="field-wrap">
<label class="view-label"for="password">Password (required, at least 8 characters)</label>
<input type="password" placeholder="Password" name="password" id="password" value="<?php echo set_value('password'); ?>" />
<span class="text-danger"><?php echo form_error('password'); ?></span>
<button type="button" id="btn-show-forgot" name="btn-show-forgot">Forgot ?</button>
</div>
<div class="field-wrap">
<button type="submit" class="btn btn-submit" name="ulogin" id="ulogin" >Login</button>
</div>
<div class="field-wrap">
<a href="javascript:void(0)" class="btn btn-link btn-nobg" id="btn-show-signup">NEW User? Sign up</a>
</div>
</form>
$('#btn-show-forgot').click(function () {
// $('#forgot-email').attr('value', null);
$('.form-div').removeClass("active");
$('#forgot-form').addClass("active");
currentActiveId = "forgot-form";
sessionStorage.setItem('activeDiv', currentActiveId);
});
jquery如下所示,如果有任何错误建议我
<script>
$(document).ready(function() {
$("#form1").validate({
rules: {
email: "required"
},
messages: {
email: "Please specify your name"
}
})
$('#btn-show-forgot').on('click', function() {
$("#form1").valid();
});
});
</script>
最佳答案
您的代码对我有用,您是否添加了 JQuery Validate 插件
库?
请参阅以下内容(您的代码+脚本包括):
<!DOCTYPE html>
<html>
<head>
<link href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
<!-- Did you omit follow library? -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/jquery.validate.min.js"></script>
</head>
<body>
<form id="form1" name="form1">
<div class="field-wrap">
<label class="view-label"for="email">Name (required, at least 2 characters)</label>
<input type="email" placeholder="Email Address" name="email" id="email" class="input-control" value="" />
<span class="text-danger"></span>
</div>
<div class="field-wrap">
<label class="view-label"for="password">Password (required, at least 8 characters)</label>
<input type="password" placeholder="Password" name="password" id="password" value="" />
<span class="text-danger"></span>
<button type="button" id="btn-show-forgot" name="btn-show-forgot">Forgot ?</button>
</div>
<div class="field-wrap">
<button type="submit" class="btn btn-submit" name="ulogin" id="ulogin" >Login</button>
</div>
<div class="field-wrap">
<a href="javascript:void(0)" class="btn btn-link btn-nobg" id="btn-show-signup">NEW User? Sign up</a>
</div>
</form>
</body>
<script>
$(document).ready(function() {
$("#form1").validate({
rules: {
email: "required"
},
messages: {
email: "Please specify your name"
}
})
$('#btn-show-forgot').on('click', function() {
$("#form1").valid();
});
});
</script>
</html>
您必须在 JQuery 验证中包含此内容:
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.16.0/jquery.validate.min.js"></script>
关于javascript - 单击忘记按钮表单应该使用 jquery 进行验证,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42969586/