关于Layer弹出层的问题,小白请教
我现在想做一弹出窗口的功能。用的layer.js。按照官方上的说明,做出的效果却不一样,弹出层显示在了body的下面。
当点击注册的时候,结果弹出层显示在了原来页面的下方,跟官网上的效果完全不一样。

我把一些相关的贴出来:
首页:
JS:
function register() {
openSelfDialog('jsp/register.jsp','注册账户','800px','600px');
}
function openSelfDialog(openUrl,showtitle,height,width) {
parent.layer.open({
type:2,
title:showtitle,
maxmin:false,
shadeClose: true, //点击遮罩关闭层
area : [width , height],
content: openUrl
});
}
而且即使是弹出一个提示层:
//弹出一个提示层
$('#test1').on('click', function(){
layer.msg('hello');
});
hello也是显示在当前页面当中,并没有弹出的效果。

跟官网上的效果完全不一样。


请问是怎么回事。
当点击注册的时候,结果弹出层显示在了原来页面的下方,跟官网上的效果完全不一样。

我把一些相关的贴出来:
首页:
<body>
<div id="container">
<label id="welcome">欢迎进入人事管理系统</label>
<div class="loginMain">
<form class="bs-example bs-example-form" role="form">
<div class="input-group input-group-lg" style="width: 300px">
<span class="input-group-addon">账号</span>
<input type="text" class="form-control" placeholder="请输入账号" id="userName">
</div>
<br>
<div class="input-group input-group-lg" style="width: 300px">
<span class="input-group-addon">密码</span>
<input type="password" class="form-control" placeholder="请输入密码" id="userPass">
</div>
<div class="input-group input-group-lg" style="width: 300px">
<input type="checkbox" id="remberPassword" style="float: left;zoom: 120%"/>
<label style="float: left;color: #f9f9f9">记住密码</label>
<a style="float: right;color: #f9f9f9;cursor: pointer" onclick="register()">注册</a>
</div>
<button type="button" class="btn btn-primary" style="width: 300px" onclick="login()" id="btn_login">登录</button>
</form>
</div>
<label id="footer">版权所有 家里蹲科技股份有限公司 CopyRight©2018</label>
</div>
</body>
JS:
function register() {
openSelfDialog('jsp/register.jsp','注册账户','800px','600px');
}
function openSelfDialog(openUrl,showtitle,height,width) {
parent.layer.open({
type:2,
title:showtitle,
maxmin:false,
shadeClose: true, //点击遮罩关闭层
area : [width , height],
content: openUrl
});
}
而且即使是弹出一个提示层:
//弹出一个提示层
$('#test1').on('click', function(){
layer.msg('hello');
});
hello也是显示在当前页面当中,并没有弹出的效果。

跟官网上的效果完全不一样。


请问是怎么回事。
...全文
相关推荐
解决layer弹出层中表单不起作用的问题
总的来说,解决layer弹出层中表单不起作用的问题主要涉及到正确选择弹出层的类型(type),以及合理地利用layui提供的表单渲染和验证功能。
解决layer弹出层自适应页面大小的问题
首先,问题的核心在于,当layer弹出层的面积设定为固定的像素值(如800px)时,如果用户使用的设备屏幕较小,弹出层可能会超出屏幕范围,导致用户无法正常操作。
解决layer弹出层msg的文字不显示的问题
layer是一款流行的JavaScript弹窗插件,它提供了丰富的弹窗类型,包括消息提示(msg)等。本文将深入探讨在使用layer弹出层时遇到的msg文字不显示问题及其解决方案。
jQuery使用Layer弹出层插件闪退问题
Layer弹出层插件:这是一个功能强大的基于jQuery的弹出层插件,广泛用于Web开发中,可以创建对话框、提示框、图片浏览器、加载动画等。作者在实现弹出层功能时,遇到了使用Layer时的闪退问题。
解决layer弹出层的内容页点击按钮跳转到新的页面问题
在开发过程中,我们经常会遇到需要在弹出层(如layer弹出层)内实现页面跳转的功能。问题在于,直接在弹出层内点击链接或按钮进行跳转时,新页面可能仍会被包含在弹出层内,而不是替代整个浏览器窗口的内容。


Web 开发
