我有一个登录表格如下.
<li class="loginlink"> <a id="showlogin" href="#"> <span style="color: #666666">Login</span> </a> <div class="loginBox" style="display: block;"> <fieldset> <label>User Name : </label> <input id="input" type="text" value="" name="input"> </fieldset> <label> <span style="display: inline-block; ...;"> Password :</span> </label> <input id="password_txt" type="password" style="padding:5px;..;" value="" name="password_txt"> <p> <a class="loginlink" onclick="mojarra.jsfcljs(document.getElementById('headerForm'),{'j_idt60':'j_idt60'},'');return false" style="color: #666666;.." href="#">Forgot Password? </a> <a class="loginlink" onclick="mojarra.jsfcljs(document.getElementById('headerForm'),{'j_idt63':'j_idt63'},'');return false" style="..." href="#">Register </a> </p> <div class="loginbuttons"> <input id="loginBtn" type="submit" value="Login" name="loginBtn"> <input id="cancellogin" type="button" value="Cancel"> </div> </div> </li>
当你点击showlogin时.我用jQuery来显示它.喜欢
$('#showlogin').click(function(){ var loginBox = $('.loginBox'); loginBox.show(); $('.loginBox fieldset input').focus(); if (!loginBox.is(':hidden')) { validateUser(); } }); $('#cancellogin').click(function(){ $('.loginBox').hide(); }); function validateUser() { $("#loginBtn").click(function(event){ var userName = $("#input").val(); var password = $("#password_txt").val(); if (userName == "") { $.dialog({ message: "UserName must be entered",imageIcon: false,type: "error",okButtonID: "ok",okButtonValue: "OK" }); return false; } return true; }); //end of click } //end of validateUser()
现在发生了什么,假设我点击按钮,显示的框就像
现在,如果我点击确定按钮.盒子消失了.
事情还可以.现在假设我通过单击取消按钮关闭登录表单.再次打开表格
但是现在这次如果我点击确定按钮,那么叠加层就会消失,但消息却没有.为什么?我得到这样的东西
为什么这次不会消失?我做错了什么?请帮忙?
谢谢
@H_301_24@解决方法
我认为这个问题与您的validateUser()函数有关.您会在每次显示登录框时看到绑定一个新的单击处理程序,该处理程序包含显示登录按钮对话框的代码.
function validateUser() { $("#loginBtn").click(function(event){ ... }); }
这意味着第二次登录框显示对话框实际显示两次.对话框第3次显示3次.你可能看不到这个,因为你的中心.如果您在$.dialog.createUI = function(config)行之后删除Javascript alert()函数{您将看到第二次显示登录信息时会收到2个警报!有关此问题的示例,请参见fiddle.
除非您的代码在验证用户函数中执行其他操作,否则我建议您删除此函数,然后在文档准备好时绑定单击处理程序.所以你最终得到这样的东西:
$(document).ready(function () { $("#loginBtn").click(function (event) { var userName = $("#input").val(); var password = $("#password_txt").val(); if (userName == "") { $.dialog({ message: "UserName must be entered",okButtonValue: "OK" }); return false; } return true; }); $('#showlogin').click(function () { var loginBox = $('.loginBox'); loginBox.show(); $('.loginBox fieldset input').focus(); // code to call validate user removed from here! }); $('#cancellogin').click(function () { $('.loginBox').hide(); }); });@H_301_24@ @H_301_24@ 原文链接:https://www.f2er.com/css/215572.html