javascript表单验证冲突
Conflict on javascript form validation
我已经实现了一个简单的javascript验证,但验证和表单提交从来不会同时发生。。。
当我使用"onsubmit"(如下所示)时,它将转到下一页,而无需验证
如果我在表单的末尾使用"onclick"
<input type="button" name="submit" id="send" value="Search Flights" onclick="return validate_booking_form();" />
</form>
它将验证输入。。但是即使是正确的输入也不会提交表格
这是我用过的代码//Javascript验证
function validate_booking_form()
{
chk_fromcity();
chk_tocity();
chk_depature_date();
}
function chk_fromcity()
{
var from_city = $('#from_cities').val();
if (from_city == '')
{
$("#from_cities").removeClass('fieldInput');
$("#from_cities").addClass('error');
$("#errormsg_from").fadeTo(200, 1, function()
{
$(this).html('Please Enter a City').addClass('errormsg');
})
}
else
{
$('#from_cities').removeClass('error');
$('#from_cities').addClass('fieldInput');
$("#errormsg_from").fadeTo(200, 1, function()
{
$(this).html('').removeClass('errormsg');
})
}
}
和形式
<form method="POST" action="../controller/booking.php" name="search_flights_names" onsubmit="return validate_booking_form();" >
/// Form content
<div class="form_input_container">
<div class="form_input">
<input type="text" id="from_cities" name="from_city" class="fieldInput" onblur="return chk_fromcity()" />
</div>
</div>
<input type="submit" name="submit" id="send" value="Search Flights" />
</form>
Submit是一个合适的按钮。
尝试在表单元素中输入onsubmit
,并在那里进行验证,而不是在单击事件上进行验证。这样按回车键不会绕过所有验证。
尝试使用Jquery validate。我认为它应该可以很好地解决您的问题
从chk_fromcity()返回false以停止表单发布到操作。
function chk_fromcity()
{
var from_city = $('#from_cities').val();
if (from_city == '')
{
$("#from_cities").removeClass('fieldInput');
$("#from_cities").addClass('error');
$("#errormsg_from").fadeTo(200, 1, function()
{
$(this).html('Please Enter a City').addClass('errormsg');
});
return false;
}
$('#from_cities').removeClass('error');
$('#from_cities').addClass('fieldInput');
$("#errormsg_from").fadeTo(200, 1, function()
{
$(this).html('').removeClass('errormsg');
})
// return true; // default is true which is why you were passing the validation
}
相关文章:
- 正在验证8个真/假复选框或复选框中的2个
- 借助asp.net验证或java脚本对多个文本进行验证
- jQuery自定义验证比较多个输入的序列
- 使用html中的外部javascript进行数据验证
- Javascript验证冲突
- jQuery插件冲突-验证和jQuery表单
- Javascript表单验证器与数学验证码冲突
- 引导程序和 jquery 验证冲突
- 脚本冲突Mootools验证与jQuery幻灯片
- javascript表单验证冲突
- Mailchimp验证与Joomla滑块冲突
- 表单验证中的表单验证io多个表单之间存在冲突
- 使用js冲突进行表单验证
- 表单输入提示与验证插件冲突
- jQuery表单验证与邮件检查功能冲突
- jQuery是否验证冲突提交函数,而不是表单按钮(图像/超链接)
- 冲突的Javascript阻止表单验证
- 冲突的Javascript阻止表单验证
- 与服务器端和客户端验证冲突
- ng消息和ui掩码在第二次验证时发生冲突