layui 打开新窗口
时间: 2023-09-22 10:05:07 浏览: 102
在 layui 中,可以使用 layer.open() 方法打开一个新窗口。该方法需要传入一个对象作为参数,对象中可以设置新窗口的一些属性,例如宽度、高度、标题、内容等。
下面是一个示例:
```javascript
layer.open({
type: 1,
title: '新窗口',
area: ['500px', '300px'],
content: '<p>Hello, world!</p>'
});
```
其中,type 表示新窗口的类型,1 表示普通窗口。title 表示窗口的标题,area 表示窗口的宽度和高度,content 表示窗口的内容。
还可以通过设置 offset 属性来调整新窗口的位置,例如:
```javascript
layer.open({
type: 1,
title: '新窗口',
area: ['500px', '300px'],
offset: '100px',
content: '<p>Hello, world!</p>'
});
```
其中,offset 的值可以是像素值或者百分比值,表示新窗口距离浏览器顶部的距离。
相关问题
layui双击表格打开新页面
你可以使用Layui的table模块提供的"on('rowDouble')"事件来实现双击表格打开新页面的功能。以下是一个简单的示例代码:
HTML:
```html
<table id="demo" lay-filter="test"></table>
```
JavaScript:
```javascript
layui.use(['table', 'layer'], function(){
var table = layui.table;
var layer = layui.layer;
//渲染表格
table.render({
elem: '#demo',
url: '/demo/table/user/',
cols: [[
{field:'id', title:'ID', width:80},
{field:'username', title:'用户名', width:120},
{field:'sex', title:'性别', width:80, sort:true},
{field:'city', title:'城市', width:100},
{field:'sign', title:'签名', width:200},
{field:'experience', title:'积分', width:80, sort:true},
{field:'score', title:'评分', width:80, sort:true},
{field:'classify', title:'职业', width:100},
{field:'wealth', title:'财富', width:135, sort:true},
]]
});
//监听表格双击事件
table.on('rowDouble(test)', function(obj){
layer.open({
type: 2,
title: '详情页',
content: '/demo/table/user/detail?id=' + obj.data.id,
area: ['800px', '600px'],
maxmin: true
});
});
});
```
在上述代码中,我们使用 table 模块的 on('rowDouble') 事件来监听表格的双击事件。当用户双击某一行数据时,会触发该事件,我们在事件监听器中打开一个新页面来显示该行数据的详情。你需要将 content 参数设置为一个对应的页面地址,并根据需要设置页面的宽度和高度。
layui在当前窗口ifram打开util.openWin(options);
要在当前窗口的iframe中打开一个新窗口,可以使用layui的util.openWin(options)方法。其中,参数options是一个对象,可以设置新窗口的一些属性,例如:
```
layui.use(['util'], function(){
var util = layui.util;
// 打开新窗口
util.openWin({
title: '新窗口',
content: 'http://www.example.com',
area: ['500px', '300px'],
maxmin: true
});
});
```
这段代码会在当前窗口的iframe中打开一个宽度为500px、高度为300px的新窗口,并且可以最大化和最小化。