单页多框架窗口管理 FrameController.js

未知
JavaScript
跨平台
2018-10-11
mqycn

项目介绍

优雅的处理单页多框架(<iframe>)窗口管理同步问题

消息数据结构

{
    event: '事件名称',
    type: 'child',
    target: '内嵌页的window',
    data: '传递的数据,即FrameController.broadcast(event, data)的data',
    frameId: '内嵌页标志'
}

使用说明

1、点击发送通知,所有打开的内嵌页都会受到通知。

基础事件

var addLog = function(from, event, data) {
    var _old = $('#log').html().substring(0, 3000);
    $('#log').html(
        (logTpl + _old)
        .replace('#EVENT#', event)
        .replace('#DATA#', JSON.stringify(data))
        .replace('#SOURCE#', from)
    );
    console.log('event:', event, 'data:', data);
};
 
//同步通知
FrameController.addListener('broadcast', function(e) {
    $('#msg').val(e.data.msg);
    addLog(e.frameId, e.event, e.data);
});
 
//发送广播
$('#send').click(function() {
    var nums = FrameController.broadcast('broadcast', {
        msg: $('#msg').val()
    });
    $('#log').html('通知成功:' + nums + '\n\n' + $('#log').html());
});
 
//更新输入状态
$('#msg').change(function() {
    FrameController.broadcast('change', {
        text: '输入框内容已更改:' + $(this).val()
    });
});
 
//更新状态
FrameController.addListener('change', function(e) {
    addLog(e.frameId, e.event, e.data);
});

2、新增 内嵌页,关闭内嵌页,可以通过:FrameController.addListener('frame.add',func)、FrameController.addListener('frame.remove',func) 进行监听

新开、关闭事件

//监听系统事件
var addLog = function(from, event, data) {
    var _old = $('#log').html().substring(0, 3000);
    $('#log').html(
        (logTpl + _old)
        .replace('#EVENT#', event)
        .replace('#DATA#', JSON.stringify(data))
        .replace('#SOURCE#', from)
    );
    console.log('event:', event, 'data:', data);
};
 
//监听系统事件
FrameController.addListener('frame.remove', function(e) {
    addLog(e.frameId, e.event, e.data);
});
FrameController.addListener('frame.add', function(e) {
    addLog(e.frameId, e.event, e.data);
});

3、可以对一个事件增加多个监听方法,可以删除所有监听方法、删除某一个监听方法

事件添加和删除

var logTpl = '事件:#EVENT# 来源:#SOURCE#\n数据:#DATA#\n\n',
    addLog = function(from, event, data) {
        var _old = $('#log').html().substring(0, 3000);
        $('#log').html(
            (logTpl + _old)
            .replace('#EVENT#', event)
            .replace('#DATA#', JSON.stringify(data))
            .replace('#SOURCE#', from)
        );
        console.log('event:', event, 'data:', data);
    },
    msgEventListener = function(e) {
        $('#log').html('自定义事件已经触发,添加多次会触发多次\n\n' + $('#log').html());
    };
 
 
//添加自定义事件
$('#add_custom').click(function() {
    FrameController.addListener('broadcast', msgEventListener);
});
 
//删除自定义事件
$('#remove_custom').click(function() {
    FrameController.removeListener('broadcast', msgEventListener);
});

更多说明请访问:http://www.miaoqiyuan.cn/p/framecontroller-js

的码云指数为
超过 的项目
加载中

评论(0)

暂无评论

暂无资讯

暂无问答

Sizing views inside a container view controller

view加载时机及View Controller Lifecycle等需理清

2014/06/16 15:44
50
0
消除 tableView 头部出现一段View

##两种情况 |情况|解决办法| |-----|---| |使用样式Groupd|a.添加View| |其他情况? | b.设置controller属性| ###a.添加View GRect frame=CGRectMake(0, 0, 0,CGFLOAT_MIN); _listView.table...

2016/07/20 18:25
7
0
automaticallyAdjustsScrollViewInsets的那些坑

@当我们在一个UIViewController中同时创建2个tableView的时候,如果把它们的frame中的Y坐标设置为一样,你可能会发现它们的位置并没有达到你想要的结果.比如第一tableView个frame(0,0,320,568...

2015/07/21 10:05
172
0
改变cell高度及其子视图的大小和位置

需求是:我现在要复用一个自定义的cell,但是这个cell的高度以及cell上的imageView的大小要变大,代码该怎样写

2015/12/16 15:23
67
0
Joint types and operation

Joint types and operation Compared to another object, a joint has two reference frames (visible only if the joint is selected). The first one is the regular reference frame that...

2018/09/29 09:02
16
0
Leap Motion API类库:Controller

1.Controller 控制器类是您的Leap Motion控制器的主要接口。 创建这个控制器类的实例,访问跟踪数据和配置信息的帧。帧数据可以在任何时候使用frame()轮询功能,调用frame() 或 frame(0) 以获...

2016/01/28 15:20
127
2
Leap 类与命名空间

1.Leap Motion所有类 Bone InteractionBox CircleGesture KeyTapGesture Controller Pointable Finger ScreenTapGesture Frame SwipeGesture Gesture Matrix math Hand Vector math 2.Leap ...

2016/01/27 11:00
67
1
计算任意一个UIView相对屏幕的坐标 

在很多时候,我们需要去计算一个UIView相对屏幕的坐标,来实现一些UI效果。 在这个UIView未被嵌套多层的时候,相对屏幕的坐标很好算,只需要精准的拿到每层superview变量去计算。 但是很多情...

2016/11/14 14:50
97
0
30天学习Swift项目实战第四天------滑动菜单(UIScrollView)

注意:项目分为3个界面,中间的界面使用了摄像头,模拟器是不能完成的。 源码分为4个文件: **ViewController.swift:** // // ViewController.swift // SlideMenu // // Created by luopan ...

2016/08/06 18:47
6
0
ios 一些api的总结

1>sizeToFit: // calls sizeThatFits: with current view bounds and changes bounds size. [button.titleLabel sizeToFit]; 让按钮内部的label根据文字内容来计算尺寸 2>layoutIfNeeded:强制...

2016/09/18 18:24
12
0

没有更多内容

加载失败,请刷新页面

返回顶部
顶部