[英]login form through lightBox Effect
我使用了最简单的CSS来显示litebox视图。 我使用的代码是,我从这里删除了不必要的CSS属性:
<style>
.black_overlay{
display: block;
}
.white_content {
display: block;
}
</style>
HTML格式
<div id="light" class="white_content">
<input id="name" name="name" type="text" />
<input id="password" name="password" type="password" />
<input type="submit" name="submit" value="Sign In" onclick="check(this.form)"/>
</div>
<div id="fade" class="black_overlay"></div>
还有一个JavaScript函数,用于检查字段是否正确
function check(form)/*function to check userid & password*/
{
var name= $( "#name" );
var pass=$("#password");
if(name== "admin" && pass == "admin")
{
document.getElementById('light').style.display='none';
document.getElementById('fade').style.display='none';
}
else
{
alert("Error Password or Username");/*displays error message*/
}
}
我想要的功能是,当用户输入正确的名称并通过时,即“管理员”,Lite框效果消失了……但事实并非如此,Lite框仍然存在。 我如何关闭它。 我还希望该litebox效果应在页面加载时显示。
更换
var name= $( "#name" );
var pass=$("#password");
与
var name= $( "#name" ).val();
var pass=$("#password").val();
是否存在捕获和阻止提交事件的问题? 在标记中没有表格。 如果您喜欢添加
<form id="submit-me"> your form inputs </div>
你可以通过JS观察它
$("#submit-me").submit(function(event) {
// your js code
event.preventDefault();
});
对于您的实际示例,您可以尝试添加“ return false;”。 在onclick处理程序中? 但是我不知道这是否有效...
最好的祝福
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.