先了解一下在web开发时候使用js要关闭弹出框的几个简单的应用
window.location.href、location.href 是本页面跳转
parent.location.href 是上一层页面跳转,也就是你在弹出时候的页面。
top.location.href是最外层的页面跳转,你懂得,在有iframe的时候你就知道他不会进入你的iframe的窗体
再就是你要从这个页面跳转到别的父级打开的页面window.parent.parent.location.href=“你定义要跳转的页面”
layer使用
本课题只探讨1.9以上的版本
看看基础参数项:调用时候用到的配置项如:layer.open({content: ''})layer.msg('', {time: 3})不需要所有都去配置,大多数都是可选的。其中layer.open、layer.msg是内置方法。
基础参数:
type - 基本层类型
type:Number,默认:0 5种提供层类型,信息框【0】,页面层【1】,iframe层【2】,加载层【3】,ips【4】层,若你采用layer.open({type: 1})方式调用,则type为必填项。
title:
title - 标题
类型:String/Array/Boolean,默认:'信息'
title支持三种类型的值,若你传入的是普通的字符串,如title :'我是标题',那么只会改变标题文本;若你还需要自定义标题区域样式,那么你可以title: ['文本', 'font-size:18px;'],数组第二项可以写任意css样式;如果你不想显示标题栏,你可以title: false
content - 内容
类型:String/DOM/Array,默认:''
content可传入的值是灵活多变的,不仅可以传入普通的html内容,还可以指定DOM,更可以随着type的不同而不同。譬如:
/!*
如果是页面层
*/
layer.open({
type: 1,
content: '传入任意的文本或html' //这里content是一个普通的String
});
layer.open({
type: 1,
content: $('#id') //这里content是一个DOM
});
//Ajax获取
$.post('url', {}, function(str){
layer.open({
type: 1,
content: str //注意,如果str是object,那么需要字符拼接。
});
});
/!*
如果是iframe层
*/
layer.open({
type: 2,
content: 'http://sentsin.com' //这里content是一个URL,如果你不想让iframe出现滚动条,你还可以content: ['http://sentsin.com', 'no']
});
/!*
如果是用layer.open执行tips层
*/
layer.open({
type: 4,
content: ['内容', '#id'] //数组第二项即吸附元素选择器或者DOM
});
skin - 样式类名
类型:String,默认:''
skin不仅允许你传入layer内置的样式class名,还可以传入您自定义的class名。这是一个很好的切入点,意味着你可以借助skin轻松完成不同的风格定制。目前layer内置的skin有:layui-layer-lanlayui-layer-molv,未来我们还会选择性地内置更多,但更推荐您自己来定义。以下是一个自定义风格的简单例子
来源http://layer.layui.com/api.html#layer.load
分享到:
相关推荐
### Layer使用总结 #### 一、Layer简介与安装 Layer是一款轻量级的JavaScript弹窗插件,由layui团队开发并维护。它以其简洁、易用的特点被广泛应用于Web前端项目中,支持提示框、模态框、加载层等多种功能。 - **...
在北极地区,由于地球曲率的影响,使用常规的经纬度坐标系会使得距离和方向的表示不准确,因此需要使用更适合极地的方位坐标系。 方位坐标系(Azimuthal Equidistant projection)是一种等距离投影,其特点是任何...
jQuery layer 漂亮实用的网页弹出层插件,layer v1.4.1 弹层组件压缩版,这个... 四、jquery必须为1.8或1.8以上版本(原因,更小,性能更好,且新版layer使用了部分jq1.8的特性),下载包里的jquery即为1.8.2下载地址
`layer`是一款在Web前端开发中广泛使用的弹出层插件,尤其在页面提示、对话框、加载提示、图片预览等方面有着出色的表现。其设计简洁,功能强大,易用性强,是提高用户体验的重要工具。本篇将详细介绍`layer`的使用...
layer网页弹出层插件,反响相当好的一款JS弹出层插件,layer兼容了包括IE6... 三、jquery必须为1.8或1.8以上版本(原因,更小,性能更好,且新版layer使用了部分jq1.8 的特性),下载包里doc文件里有jquery1.9下载地址
在本文中,我们将深入探讨`layer.js`的使用方法,帮助开发者更好地理解和应用这个工具。 ### 1. 安装与引入 首先,你需要下载`layer.js`文件,将其放在项目目录中,并通过HTML中的`<script>`标签引入。例如: ```...
本示例"iClient for OpenLayer对接MVT矢量瓦片demo"主要展示了如何使用OpenLayers库与超图iClient进行交互,以加载和显示MVT(Map Vector Tiles)格式的矢量瓦片数据。MVT是一种高效、轻量级的地理空间数据存储格式...
深度学习与PyTorch入门实战视频教程 配套源代码和PPT深度学习与PyTorch入门实战视频教程 配套源代码和PPT深度学习与PyTorch入门实战视频教程 配套源代码和PPT深度学习与PyTorch入门实战视频教程 配套源代码和PPT深度...
《layer-v3.1.1组件使用详解》 在网页开发中,弹出层组件扮演着重要的角色,它能够提供信息提示、对话框、加载效果等功能,极大地提升了用户体验。layer-v3.1.1作为一款广泛应用的弹出层组件,其功能强大且易于使用...
《可拖动图片弹出层插件layer.js详解》 在网页开发中,为了提供更好的用户体验,有时我们需要创建一种能够弹出并展示...在实际使用中,开发者应结合自身项目需求,合理利用layer.js提供的各种特性,以达到最佳的效果。
在IT行业中,跨域问题是一个常见的挑战,尤其是在网页开发中,比如当我们在使用layer弹窗插件时,可能会遇到从子页面弹出一个窗口到父页面的情况。标题和描述所提及的是一个关于如何解决layer弹窗在跨域环境下的问题...
本篇文章将深入探讨layer模板引擎的使用方法和核心特性。 ### 1. 模板语法 layer模板引擎的语法简洁直观,主要由标签和表达式组成。例如,`{{ }}`用于包裹变量,`{% %}`用于控制流程结构,`{# }`用于迭代。下面是...
首先,我们来了解layer的基本使用。在layer-v3.0.3版本中,主要包含以下核心功能: 1. **提示信息**:layer提供了多种提示信息样式,包括信息提示、成功提示、错误提示等,只需简单调用API即可实现。 ```...
在Vue项目中,为了实现各种弹框功能,如提示、确认、信息框等,我们可以使用vue-layer这个弹框插件。vue-layer是一个基于Vue.js的轻量级弹窗组件,它提供了丰富的弹框类型和自定义选项,适用于多种场景。 首先,...
一、使用时,请把文件夹layer整个放置在您站点的任何一个目录,只需引入layer.js即可,除jQuery外,其它文件无需再引入。 二、如果您的js引入是通过合并处理或者您不想采用layer自动获取的绝对路径,您可以通过layer...
- **添加图层**:使用`ol.layer.Tile`或`ol.layer.Image`来添加地图瓦片图层,例如OpenStreetMap或其他GIS服务。 - **创建遮罩**:创建一个`ol.Feature`对象,表示遮罩的形状,如矩形或圆。然后,使用`ol.style....
10. **文档和社区支持**:layer有一个完善的官方文档,详细介绍了各个API的使用方法,同时拥有活跃的社区,用户可以在这里找到解决方案或分享经验。 总的来说,"layer-v3.1.0"作为一个强大的Web开发工具,为前端...
Layer List是Anroid中的一种图形的方式,它是通过叠加若干张图片的方式来形成最终的图片,最终的图片在代码中表现为一个LayerDrawable对象。在android UI 开发中会经常遇到。因此我们有发现好好学习了解它的使用方法...
1. **易用性**:layer 设计简洁,API 易于理解和使用,无论是新手还是经验丰富的开发者都能快速上手。 2. **全面性**:提供了丰富的弹层类型,包括消息提示、对话框、iframe、加载层、提示层、图片层等,满足多样化...
layer是一款广泛使用的JavaScript弹层插件,尤其在版本v3.0.1中,其功能更加完善,性能更加强大。本文将深入探讨layer的核心特性、使用方法以及在实际项目中的应用。 一、layer概述 layer是一款轻量级的弹层插件,...