jqury 右击事件插件

时间：2023-12-24 11:54:55

　　在有些时候，网页中需要给一些标签对象加入右击的事件，在网上看了一些小的插件，但是不能根据this获取到当前的标签。所以相对他们进行改进一下。自己写了一个小的js右击事件。废话不多说了，看代码。

$(function () {

    $.fn.rightclick = function (f) {

        var _this = this;

        var pthis = $(_this.selector);
　　　　 //清除html的右击菜单

        $(document).mousedown(function (e) {

            if (e.button != 1)

                return false;

        });

        //为这个对象绑定鼠标按下事件

        $(this).mousedown(function (e) {

            //如果按下的是右键，则执行函数

            if (3 == e.which) {

                //把这个对象的this付给制定传入方法（f）

                f.call(this);

            }

        });

    }

});

　　这样的话就可以对单独的标签进行添加rightclick事件了，下面可以给一个例子。

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title>右击事件</title>

    <script src="Scripts/jquery-1.7.1.js"></script>

    <script src="Scripts/rightclick.js"></script>

    <style>

        li {

            height:20px; border:#b6ff00 1px solid; line-height:20px; width:20px;margin:10px;

        }

    </style>

    <script>

        $(function () {

            $(".li").rightclick(cli);

            $("#a").rightclick(function () {

                alert("你看看");

            })

        });

        function cli () {

            var index = $(".li").index(this);

            alert('这个标签的index是'+index);

        }

    </script>

</head>

<body>

    <ul>

        <li class="li">1</li>

        <li class="li">2</li>

        <li class="li">3</li>

        <li class="li">4</li>

        <li class="li">5</li>

        <li class="li">6</li>

    </ul>

    <p id="a">右击</p>

</body>

</html>

但是这个事件并不支持bind("rightclick",function(){});这样的写法。如果有大神看到的话希望联系改进一下。

仅此，谢谢捧场。

相关文章