day49—JavaScript阻止浏览器默认行为

转行学开发，代码100天——2018-05-04

今天主要说明一下通过JavaScript对浏览器默认行为的阻止操作。比如右键菜单的行为。

阻止默认行为的语句为：

return false;

例如，阻止浏览器默认菜单同时弹出自定义菜单的一个功能实现如下：

<div id="div1">

    <ul>

        <li>24334</li>

        <li>sdafds</li>

        <li>wrw23</li>

    </ul>

</div>

    <style type="text/css">

        ul li{

            list-style: none;

            text-align: left;

            font-size: 12px;

        }

        #div1{

            width: 80px;

            width: 100px;

            position: absolute;

            background: #ccc;

            border: 1px solid black;

            display: none;

        }

    </style>

Js部分需要对文档添加右键事件，通过该事件取消浏览器默认的右键菜单，同时弹出自定义菜单；

添加点击事件，通过点击实现自定义右键菜单的消失。

<script type="text/javascript">

        document.oncontextmenu = function(ev){

            var oEvent = ev||event;

            var oDiv = document.getElementById("div1");

            oDiv.style.display = "block";

            oDiv.style.left = oEvent.clientX+"px";

            oDiv.style.top = oEvent.clientY+"px";

            return false;

        }

        document.onclick = function(){

            var oDiv = document.getElementById("div1");

            oDiv.style.display = "none";

        }

    </script>

巴特西

day49—JavaScript阻止浏览器默认行为

最新文章

热门文章