首页 Axure教程正文

#推荐
【基础教程】屏蔽浏览器右键菜单

most Axure教程

2024-07-02 0 1,077

在用Axure RP设计原型的时候，需要做这样一个交互：单击鼠标右键时，显示或隐藏一部分内容。但是鼠标右键在浏览器中默认会出来系统菜单。就会遮挡住我们想要展示的内容。

那么有没有办法禁用浏览器的右键菜单呢？当然可以实现，但这基本不属于axure的范畴了，是利用JS代码实现的。如果你有这种特殊需要，就按下面的方法操作吧！

首先，顶部菜单打开【发布】>【生成HTML 文件】进入下面的界面。

然后下面严格按照以下步骤操作：

1、点击Fonts，切换到自定义字体面板。

2、点击添加字体按钮

3、名称那里随便输入个123

4、点击@font-face

5、在下面的代码输入区输入下面的代码。

</style>
<script>
document.oncontextmenu = function (event){
    if(window.event){
        event = window.event;
    }try{
        var the = event.srcElement;
        if (!((the.tagName == "INPUT" && the.type.toLowerCase() == "text") || the.tagName == "TEXTAREA")){
            return false;
        }
        return true;
    }catch (e){
        return false; 
    } 
}
</script><style>

输入代码后关闭掉这个界面即可，会自动保存。

然后再点预览，你的原型就不会出现浏览器的右键菜单了。

这段代码对输入框做了例外判断，不会影响粘贴内容到输入框中。

收藏打赏