我正在使用CodePen中的这个jQuery https://codepen.io/dicson/pen/eJzoEX&它工作得很好但是它以某种方式阻止FormMethod.Post
动作被解雇。我对JS / JQuery不是很有经验,所以希望有人可以提供帮助。
FORM
@using (Html.BeginForm("Login", "Authentication", FormMethod.Post, new { role = "form" }))
{
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<form class="form">
<div class="f_row">
<label>Username</label>
@Html.TextBoxFor(m => m.Email, new { @name = "username", @type = "username", @class = "input-field", @required = "" })
@Html.ValidationMessageFor(m => m.Email, "", new { @class = "text-danger" })
<u></u>
</div>
<div class="f_row last">
<label>Password</label>
@Html.PasswordFor(m => m.Password, new { @name = "pass", @type = "password", @class = "input-field", @required = "" })
@Html.ValidationMessageFor(m => m.Password, "", new { @class = "text-danger" })
<u></u>
</div>
<div class="form-group">
<input type="submit" value="GO" class="btn btn-default submit-btn input-field" />
</div>
</form>
}
JQUERY
var inP = $('.input-field');
inP.on('blur', function () {
if (!this.value) {
$(this).parent('.f_row').removeClass('focus');
} else {
$(this).parent('.f_row').addClass('focus');
}
}).on('focus', function () {
$(this).parent('.f_row').addClass('focus');
$('.btn').removeClass('active');
$('.f_row').removeClass('shake');
});
$('.resetTag').click(function(e){
e.preventDefault();
$('.formBox').addClass('level-forget').removeClass('level-reg');
});
$('.back').click(function(e){
e.preventDefault();
$('.formBox').removeClass('level-forget').addClass('level-login');
});
$('.regTag').click(function(e){
e.preventDefault();
$('.formBox').removeClass('level-reg-revers');
$('.formBox').toggleClass('level-login').toggleClass('level-reg');
if(!$('.formBox').hasClass('level-reg')) {
$('.formBox').addClass('level-reg-revers');
}
});
$('.btn').each(function() {
$(this).on('click', function (e) {
e.preventDefault();
var finp = $(this).parent('form').find('input');
console.log(finp.html());
if (!finp.val() == 0) {
$(this).addClass('active');
}
setTimeout(function () {
inP.val('');
$('.f_row').removeClass('shake focus');
$('.btn').removeClass('active');
}, 2000);
if (inP.val() == 0) {
inP.parent('.f_row').addClass('shake');
}
//inP.val('');
//$('.f_row').removeClass('focus');
});
});
如果我不加载jquery,表单工作正常。
运行jquery时,我在控制台上获得了一个未定义的日志