jquery右键菜单

最近要写一个右键菜单 上百度一看 发现有很多插件,但是因为本人能力有限啊,不会去改插件来满足后台小哥哥的要求,因此,就像算啦,干嘛不自己写,难道真的那么难么?先插入html吧

 1  <!--右键-->
 2     <div class="menuRight" id="menuRight" style="display: none;">
 3 
 4         <ul>
 5 
 6             <li id="open"><span>
 7                 <img src="/Themes/Default/Images/menubao.png"></span><span>报警设置</span></li>
 8 
 9             <li id="email"><span>
10                 <img src="/Themes/Default/Images/menushe.png"></span><span>设置</span></li>
11 
12             <li id="save"><span>
13                 <img src="/Themes/Default/Images/menubian.png"></span><span>编辑</span></li>
14 
15             <li id="close"><span>
16                 <img src="/Themes/Default/Images/menushan.png"></span><span>删除</span></li>
17 
18         </ul>
19 
20     </div>
 function ss(){
            $(".menuRight ul li").hover(
                  function () {
                      $(this).css('backgroundColor','#ccc');
                      $(this).siblings().css('backgroundColor','#fff');
                  },
                  function () {
                      $(this).css('backgroundColor','#fff');
                  }
                );
        }
        //某元素组织右键点击事件
        $('body').bind("contextmenu", function(){
            return false;//屏蔽右键
        })
        $(".tr").each(function(i){
            $(this).mousedown(function(e) { //右键为3
                //获取当前tr的任意td
                //alert($(this).find('td').eq(10).text())
                 ss();
                var menuh=$('.menuRight').height();
                var wh=$(window).height();
                //定位
                if (3 == e.which) {
                  //超出边界范围
                    if((menuh+e.pageY )>=wh){
                        var top=e.pageY-menuh;
                        $('.menuRight').css({'left':e.pageX+'px','top':top+'px'});
                    }
                    else{
                        $('.menuRight').css({'left':e.pageX+'px','top':e.pageY+'px'});
                    }
                    $('.menuRight').show();
                }
return false; }) }); //任意键关闭 $("body").click(function(){ $('.menuRight').hide(); });
posted @ 2017-03-31 13:47  niu2016  阅读(184)  评论(0编辑  收藏  举报