safari表单验证只在第二个按钮点击,但在IE第一次点击本身工作良好
safari form validation works only in second button click, but works fine in IE 1st click itself
我使用下面的jquery进行表单验证,下面的代码在IE9中工作得很好,但在safari中有时它只在第二次点击按钮时工作。
例如
我正在输入正确的电子邮件和错误的密码,它显示错误消息,然后我更正密码并单击按钮,错误被删除,但表单没有提交,然后我再次单击按钮,它正在提交。这只发生在safari中。我用的是safari 5.1
以及我认为单一的准备函数是足够的,但我使用2准备函数,其中一个我应该在不影响现有功能的情况下删除。
jQuery().ready(function domReady($) {
$('#txtLogin_Id').removeClass('outLineRed');
$('#txtPassword').removeClass('outLineRed');
$('#spnLoginErr').hide();
$('#txtLogin_Id').watermark("Email Address");
$('#txtPassword').watermark("Password");
if ($('#lblLoginErr').val() != '') {
$('#spnLoginErr').show();
$('#spnLoginErr').html($('#lblLoginErr').val());
$('#MsgSucc').attr("style", "background-color:White;!important;");
}
else {
$('#spnLoginErr').hide();
$('#MsgSucc').attr("style", "background-color:#dfe5e6;");
}
$('#txtLogin_Id').blur(function () {
if ($('#txtLogin_Id').val() == '') {
$('#txtLogin_Id').addClass('outLineRed');
$('#spnLoginErr').show();
$('#spnLoginErr').html("Please enter email address.");
$('#MsgSucc').attr("style", "background-color:White;");
$("html, body").animate({ scrollTop: 0 }, "slow");
return false;
}
else {
$('#spnLoginErr').hide();
$('#MsgSucc').attr("style", "background-color:#dfe5e6;");
$('#txtLogin_Id').removeClass('outLineRed');
}
}
);
$('#txtPassword').blur(function () {
if ($('#txtPassword').val() == '') {
$('#txtPassword').addClass('outLineRed');
$('#spnLoginErr').show();
$('#spnLoginErr').html("Password has to be more than 6 characters");
$('#MsgSucc').attr("style", "background-color:White;");
$("html, body").animate({ scrollTop: 0 }, "slow");
return false;
}
else {
$('#spnLoginErr').hide();
$('#MsgSucc').attr("style", "background-color:#dfe5e6;");
$('#txtPassword').removeClass('outLineRed');
}
}
);
$('#BtnLogin').click(function () {
if ($('#txtPassword').val() == '' && $('#txtLogin_Id').val() == '') {
$('#txtLogin_Id').addClass('outLineRed');
$('#txtPassword').addClass('outLineRed');
$('#spnLoginErr').show();
$('#spnLoginErr').html("Please enter email address and password.");
$('#MsgSucc').attr("style", "background-color:White;!important;");
$("html, body").animate({ scrollTop: 0 }, "slow");
return false;
}
else {
$('#MsgSucc').attr("style", "background-color:#dfe5e6;");
}
if ($('#txtLogin_Id').val() == '') {
$('#txtLogin_Id').addClass('outLineRed');
$('#spnLoginErr').show();
$('#spnLoginErr').html("Please enter email address.");
$('#MsgSucc').attr("style", "background-color:White;!important;");
$("html, body").animate({ scrollTop: 0 }, "slow");
return false;
}
else {
$('#txtLogin_Id').removeClass('outLineRed');
$('#MsgSucc').attr("style", "background-color:#dfe5e6;");
}
if ($('#txtPassword').val() == '') {
$('#txtPassword').addClass('outLineRed');
$('#spnLoginErr').show();
$('#spnLoginErr').html("Password has to be more than 6 characters");
$('#MsgSucc').attr("style", "background-color:White;!important;");
$("html, body").animate({ scrollTop: 0 }, "slow");
return false;
}
else {
$('#txtPassword').removeClass('outLineRed');
$('#MsgSucc').attr("style", "background-color:#dfe5e6;");
}
});
(function errorMsgBasedhighlight() {
if ($('#lblLoginErr').val() == 'Please enter a valid email address and password.') {
$('#txtPassword').addClass('outLineRed');
$('#txtLogin_Id').addClass('outLineRed');
}
else if ($('#lblLoginErr').val() == 'Please enter a valid email address.') {
$('#txtLogin_Id').addClass('outLineRed');
}
else if ($('#lblLoginErr').val() == 'Please enter a valid Password.') {
$('#txtPassword').addClass('outLineRed');
}
else {
$('#txtLogin_Id').removeClass('outLineRed');
$('#txtPassword').removeClass('outLineRed');
}
})($);
$('#txtLogin_Id').blur(function () {
if ($('#txtLogin_Id').val() == '') {
$('#txtLogin_Id').addClass('outLineRed');
return false;
}
else {
$('#lblLoginErr').hide();
$('#txtLogin_Id').removeClass('outLineRed');
}
}
);
$('#txtLogin_Id').blur(function () {
if ($('#txtPassword').val() == '') {
$('#txtPassword').addClass('outLineRed');
return false;
}
else {
$('#lblLoginErr').hide();
$('#txtPassword').removeClass('outLineRed');
}
}
);
});
我自己发现了问题,这是因为同一文本框的2个模糊函数和重写domReady
下面是代码 $(document).ready{function(){
$('#txtLogin_Id').removeClass('outLineRed');
$('#txtPassword').removeClass('outLineRed');
$('#spnLoginErr').hide();
$('#txtLogin_Id').watermark("Email Address");
$('#txtPassword').watermark("Password");
if ($('#lblLoginErr').val() != '') {
$('#spnLoginErr').show();
$('#spnLoginErr').html($('#lblLoginErr').val());
$('#MsgSucc').attr("style", "background-color:White;!important;");
}
else {
$('#spnLoginErr').hide();
$('#MsgSucc').attr("style", "background-color:#dfe5e6;");
}
$('#txtLogin_Id').blur(function () {
if ($('#txtLogin_Id').val() == '') {
$('#txtLogin_Id').addClass('outLineRed');
$('#spnLoginErr').show();
$('#spnLoginErr').html("Please enter email address.");
$('#MsgSucc').attr("style", "background-color:White;");
$("html, body").animate({ scrollTop: 0 }, "slow");
return false;
}
else {
$('#spnLoginErr').hide();
$('#MsgSucc').attr("style", "background-color:#dfe5e6;");
$('#txtLogin_Id').removeClass('outLineRed');
}
}
);
$('#txtPassword').blur(function () {
if ($('#txtPassword').val() == '') {
$('#txtPassword').addClass('outLineRed');
$('#spnLoginErr').show();
$('#spnLoginErr').html("Password has to be more than 6 characters");
$('#MsgSucc').attr("style", "background-color:White;");
$("html, body").animate({ scrollTop: 0 }, "slow");
return false;
}
else {
$('#spnLoginErr').hide();
$('#MsgSucc').attr("style", "background-color:#dfe5e6;");
$('#txtPassword').removeClass('outLineRed');
}
}
);
$('#BtnLogin').click(function () {
if ($('#txtPassword').val() == '' && $('#txtLogin_Id').val() == '') {
$('#txtLogin_Id').addClass('outLineRed');
$('#txtPassword').addClass('outLineRed');
$('#spnLoginErr').show();
$('#spnLoginErr').html("Please enter email address and password.");
$('#MsgSucc').attr("style", "background-color:White;!important;");
$("html, body").animate({ scrollTop: 0 }, "slow");
return false;
}
else {
$('#MsgSucc').attr("style", "background-color:#dfe5e6;");
}
if ($('#txtLogin_Id').val() == '') {
$('#txtLogin_Id').addClass('outLineRed');
$('#spnLoginErr').show();
$('#spnLoginErr').html("Please enter email address.");
$('#MsgSucc').attr("style", "background-color:White;!important;");
$("html, body").animate({ scrollTop: 0 }, "slow");
return false;
}
else {
$('#txtLogin_Id').removeClass('outLineRed');
$('#MsgSucc').attr("style", "background-color:#dfe5e6;");
}
if ($('#txtPassword').val() == '') {
$('#txtPassword').addClass('outLineRed');
$('#spnLoginErr').show();
$('#spnLoginErr').html("Password has to be more than 6 characters");
$('#MsgSucc').attr("style", "background-color:White;!important;");
$("html, body").animate({ scrollTop: 0 }, "slow");
return false;
}
else {
$('#txtPassword').removeClass('outLineRed');
$('#MsgSucc').attr("style", "background-color:#dfe5e6;");
}
});
(function errorMsgBasedhighlight() {
if ($('#lblLoginErr').val() == 'Please enter a valid email address and password.') {
$('#txtPassword').addClass('outLineRed');
$('#txtLogin_Id').addClass('outLineRed');
}
else if ($('#lblLoginErr').val() == 'Please enter a valid email address.') {
$('#txtLogin_Id').addClass('outLineRed');
}
else if ($('#lblLoginErr').val() == 'Please enter a valid Password.') {
$('#txtPassword').addClass('outLineRed');
}
else {
$('#txtLogin_Id').removeClass('outLineRed');
$('#txtPassword').removeClass('outLineRed');
}
})($);
});
使用
$( document ).ready(function() {
不是jQuery().ready(function domReady($) {
相关文章:
- 相同的RegExp返回不同的结果-第一次是正确的结果,第二次是null
- 删除确认对话框在第一次单击时不起作用
- Javascript:JSON请求仅在第一次工作
- 推特引导:弹出窗口不会在第一次点击时出现,但会在第二次点击时显示
- 角度提交仅进行第一次v2错误
- 设置第一次执行的超时
- 为第一次尝试Javascript的经验丰富的开发人员提供建议
- jQuery on()-不;第一次点击时无法工作
- 第一次点击动态创建的表后,点击不工作
- 在Rails中第一次单击后禁用链接,Coffeescription
- PHP和JS脚本的奇怪问题,在我刷新页面之前第一次失败
- 循环中的切换脚本只适用于第一次迭代
- 在没有焦点的情况下捕获画布上的第一次单击事件
- Javascript onclick事件在第一次单击时未启动
- 让jqGrid第一次工作
- addClass,它更改bg图像,但在第一次加载时没有闪烁
- Cordova AngularJS Ionic标签的内容在第一次加载时重叠
- safari表单验证只在第二个按钮点击,但在IE第一次点击本身工作良好
- & lt; a href =“干净的在不工作在第一次点击,但在第二次点击在FF,在IE工作得很好
- Bootstrap Carousel在第一次打开IE后停止工作