Javascript 验证错误行为(不总是有效)
我正在尝试为from创建一些验证。非常简单,有3个输入字段,我想确保它们不是空的 总的来说,这似乎是可行的,但-我遇到了一个我不知道如何解决的问题。 首先,展示它的外观:(该死,我没有足够的代表来发布图片。我希望有人不介意查看链接。) 验证前的外观: (呃,只有两个链接)基本上与有效链接相同,但没有绿色边框 使用有效输入: 现在,问题来了;如果我从第一个字段开始,然后转到下一个字段,然后是最后一个字段,而没有点击输入,它将按其应该的方式通过。但如果我点击返回到输入字段2并删除输入(这意味着它是假的),它仍然显示为有效 我完成前一步后的情况: 现在,对于代码 HTML:Javascript 验证错误行为(不总是有效),javascript,jquery,html,validation,Javascript,Jquery,Html,Validation,我正在尝试为from创建一些验证。非常简单,有3个输入字段,我想确保它们不是空的 总的来说,这似乎是可行的,但-我遇到了一个我不知道如何解决的问题。 首先,展示它的外观:(该死,我没有足够的代表来发布图片。我希望有人不介意查看链接。) 验证前的外观: (呃,只有两个链接)基本上与有效链接相同,但没有绿色边框 使用有效输入: 现在,问题来了;如果我从第一个字段开始,然后转到下一个字段,然后是最后一个字段,而没有点击输入,它将按其应该的方式通过。但如果我点击返回到输入字段2并删除输入(这意味着它是假
<form id="modal-form">
<div class="fieldcheck priceModelInput">
<label>1 week</label>
<div class="input-group med-input">
<input id="WeekOneInput" type="number" min="0" value="" />
<span class="input-group-addon">
<i class="icon-money"></i>
</span>
</div>
</div>
<div class="fieldcheck priceModelInput">
<label>2 weeks</label>
<div class="input-group med-input">
<input id="WeekTwoInput" type="number" min="0" value="" />
<span class="input-group-addon">
<i class="icon-money"></i>
</span>
</div>
</div>
<div class="fieldcheck priceModelInput">
<label>Per Day</label>
<div class="input-group med-input">
<input id="DayInput" type="number" min="0" value="" />
<span class="input-group-addon">
<i class="icon-money"></i>
</span>
</div>
</div>
</form>
所以。。有人知道他为什么会这样吗?如何避免呢
问候
Naoness.将
名称添加到输入
部分解决了问题。实际上,键入正确的值然后删除它仍然会产生奇怪的行为(不显示错误),但这种行为甚至在中也会出现。但至少在点击submit
的过程中,验证是有效的
你能举个例子吗?当然可以!在路上,但是我以前没有真正用过小提琴,所以根本不起作用。可能是因为我正在处理的项目使用的是引导MVC。
$('#modal-form').validate({
rules: {
WeekOneInput: {
minlength: 1,
required: true
},
WeekTwoInput: {
minlength: 1,
required: true
},
DayInput: {
minlength: 1,
required: true
}
},
errorPlacement: function (error, element) {
error.appendTo(element.parent());
}
});
//Tried this function to extra check it but without succes.
$('#WeekOneInput, #WeekTwoInput, #DayInput').on('focusout', function () {
if ($(this).hasClass('valid')) $(this).valid();
});
<input id="WeekOneInput" name="WeekOneInput" type="number" min="0" value="" />
<input id="WeekTwoInput" name="WeekTwoInput" type="number" min="0" value="" />
<input id="DayInput" name="DayInput" type="number" min="0" value="" />