MyException - 我的异常网
当前位置:我的异常网» Web前端 » 拾掇一下嵌入式WEB开发中的各种屏蔽(转)

拾掇一下嵌入式WEB开发中的各种屏蔽(转)

www.MyException.Cn  网友分享于:2015-02-11  浏览:0次
整理一下嵌入式WEB开发中的各种屏蔽(转)

http://imochen.com/tidy-up-the-embedded-web-development-in-a-variety-of-shielding.html

 

每次做客户端WEB页,总会遇到QA提出的BUG,“F5没屏、右键菜单没屏、怎么还能选中呢、我去。你屏蔽了选择、这input里面的内容也不能选了,这不科学。你看,你看,我可以把这个图片托到桌面”。可能,以后,再也听不到这种声音了。。。不是QA挂了,是我有对策了,哈哈。

为什么要屏蔽各种热键

在嵌入式WEB中,要高仿原生的效果,所以,网页上的这些热键就显得不那么和谐了。还好,有js,我们可以轻松的干掉这些不想要的东西。但是即使这样,还是会有这样那样的问题,那我们就一起来看一下,怎么搞

QA

屏蔽热键刷新

一般我们想到的就是F5,Ctrl + F5,为了保险起见,我们把Ctrl + R也加上,不知道大家有没有遇到这种情况。Ctrl + N的时候在IE下就重新开了一个浏览器打开了当前页面。这个虽然不是刷新,但是也归类到这里里面。顺手把这个干掉,代码如下,keyCode大家可以对应一下。反正我也记不住,每次都打出来看看。

var event = e || window.event;
var k = event.keyCode;
if((event.ctrlKey == true && k == 82) || (event.ctrlKey == true && k == 78) || (k == 116) || (event.ctrlKey == true && k == 116))
{
    event.keyCode = 0;
    event.returnValue = false;
    event.cancelBubble = true;
    return false;
}

右键这个必须屏掉

就目前遇到的,右键分为flash上的和页面上的。其实这个我没做测试。我个人猜测,flash不在文档流的时候,右键是独立的。不过,一般做嵌入式的时候,都会把flash处理一下,所以这个问题不大。右键屏蔽就比较简单了。

document.oncontextmenu = function(){
    return false;
};

禁止拖拽

同样简单的还有拖拽,就不解释了。开始拖拽的时候return false就可以了

document.ondragstart = function(){
    return false;
};

屏蔽了选中

不允许用户用鼠标来选中内容,但是如果是在input或者是textarea上的时候,是可以选择的,

document.onselectstart = function( e ){
    //屏蔽选择,textarea 和 input 除外
    var event = e || window.event;
    var tagName = '';
    try{
        tagName = (event.target || event.srcElement).tagName.toLowerCase();
    }
    catch(e){}
    if( tagName != 'textarea' && tagName != 'input'){
        return false;
    }
}

a标签强制新窗口

document.onclick = function( e ){
    //屏蔽 Shift + click Ctrl + click

    var event = e || window.event;

    var tagName = '';
    try{
        tagName = (event.target || event.srcElement).tagName.toLowerCase();
    }
    catch(e){}

    if( (event.shiftKey || event.ctrlKey) && tagName == 'a' ){
        event.keyCode = 0;
        event.returnValue = false;
        event.cancelBubble = true;
        return false;
    }
}

文章评论

Google伦敦新总部 犹如星级庄园
Google伦敦新总部 犹如星级庄园
Java程序员必看电影
Java程序员必看电影
老程序员的下场
老程序员的下场
5款最佳正则表达式编辑调试器
5款最佳正则表达式编辑调试器
2013年中国软件开发者薪资调查报告
2013年中国软件开发者薪资调查报告
“肮脏的”IT工作排行榜
“肮脏的”IT工作排行榜
编程语言是女人
编程语言是女人
那些性感的让人尖叫的程序员
那些性感的让人尖叫的程序员
程序员周末都喜欢做什么?
程序员周末都喜欢做什么?
要嫁就嫁程序猿—钱多话少死的早
要嫁就嫁程序猿—钱多话少死的早
程序员眼里IE浏览器是什么样的
程序员眼里IE浏览器是什么样的
代码女神横空出世
代码女神横空出世
程序员和编码员之间的区别
程序员和编码员之间的区别
Web开发人员为什么越来越懒了?
Web开发人员为什么越来越懒了?
十大编程算法助程序员走上高手之路
十大编程算法助程序员走上高手之路
10个调试和排错的小建议
10个调试和排错的小建议
程序猿的崛起——Growth Hacker
程序猿的崛起——Growth Hacker
不懂技术不要对懂技术的人说这很容易实现
不懂技术不要对懂技术的人说这很容易实现
程序员的一天:一寸光阴一寸金
程序员的一天:一寸光阴一寸金
程序员必看的十大电影
程序员必看的十大电影
程序员应该关注的一些事儿
程序员应该关注的一些事儿
程序员都该阅读的书
程序员都该阅读的书
程序员最害怕的5件事 你中招了吗?
程序员最害怕的5件事 你中招了吗?
什么才是优秀的用户界面设计
什么才是优秀的用户界面设计
2013年美国开发者薪资调查报告
2013年美国开发者薪资调查报告
漫画:程序员的工作
漫画:程序员的工作
鲜为人知的编程真相
鲜为人知的编程真相
Java 与 .NET 的平台发展之争
Java 与 .NET 的平台发展之争
聊聊HTTPS和SSL/TLS协议
聊聊HTTPS和SSL/TLS协议
一个程序员的时间管理
一个程序员的时间管理
科技史上最臭名昭著的13大罪犯
科技史上最臭名昭著的13大罪犯
看13位CEO、创始人和高管如何提高工作效率
看13位CEO、创始人和高管如何提高工作效率
我是如何打败拖延症的
我是如何打败拖延症的
写给自己也写给你 自己到底该何去何从
写给自己也写给你 自己到底该何去何从
10个帮程序员减压放松的网站
10个帮程序员减压放松的网站
做程序猿的老婆应该注意的一些事情
做程序猿的老婆应该注意的一些事情
那些争议最大的编程观点
那些争议最大的编程观点
为什么程序员都是夜猫子
为什么程序员都是夜猫子
老美怎么看待阿里赴美上市
老美怎么看待阿里赴美上市
如何成为一名黑客
如何成为一名黑客
旅行,写作,编程
旅行,写作,编程
我的丈夫是个程序员
我的丈夫是个程序员
Web开发者需具备的8个好习惯
Web开发者需具备的8个好习惯
初级 vs 高级开发者 哪个性价比更高?
初级 vs 高级开发者 哪个性价比更高?
中美印日四国程序员比较
中美印日四国程序员比较
 程序员的样子
程序员的样子
团队中“技术大拿”并非越多越好
团队中“技术大拿”并非越多越好
亲爱的项目经理,我恨你
亲爱的项目经理,我恨你
总结2014中国互联网十大段子
总结2014中国互联网十大段子
软件开发程序错误异常ExceptionCopyright © 2009-2015 MyException 版权所有