在有些时候，网页中需要给一些标签对象加入右击的事件，在网上看了一些小的插件，但是不能根据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(){});这样的写法。如果有大神看到的话希望联系改进一下。

仅此，谢谢捧场。

jqury 右击事件插件的更多相关文章

  1. js为鼠标添加右击事件

    <script language="javascript">  /*document.oncontextmenu=Youji;*/  //为当前文档添加鼠标右击事件,防 ...

  2. js右击事件

    先贴代码: <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF ...

  3. ztree实现根节点右击事件，显示添加删除

    需求,右击树节点,出现编辑和删除的提示框 1:在setting 配置里面,给callback设置,右击事件onRightClick: 2:写一个函数onRightClick function onRi ...

  4. 网页里如何使用js屏蔽鼠标右击事件

    图片.png 在后台管理系统里面,遇到了这样的一个问题,右击ztree菜单,弹出修改界面,但是,现在确实这样的,右击默认弹出功能提示的框框,看上去似乎很影响自己想要的功能,只能禁用了,那么,网页里如何 ...

  5. jQuery插件（右击事件）

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. jGestures: jQuery的手势事件插件

    官网地址:http://jgestures.codeplex.com/文档版本号: v0.7,由neuedigitale编辑,2012年5月8日最新稳定版: jGestures v0.90 - sha ...

  7. 【javascript】jQuery判断用户右击事件

    jquery 判断用户是鼠标是右击还是左击, // 1 = 鼠标左键 left; 2 = 鼠标中键; 3 = 鼠标右键 $(document).mousedown(function(e) { if(3 ...

  8. chrome浏览器页面获取绑定返回顶部动画事件插件

    在chrome浏览器下页面加载: var top = $("body").scrollTop()  ; console.log(top)                      ...

  9. C#父窗体右击事件实现

    之前在博问上提问过,没人回答啊,豆太少没人权? 没注册钩子的话根本没办法弹出右键菜单啊,因为在父窗体内有一个容器,所以鼠标在右击时是无法触发窗体的mousedown事件的,即使把KeyPreview设 ...

随机推荐

  1. 让div支持placeholder属性/模拟输入框的placeholder属性

    实现方式:css div:empty:before{ content: attr(placeholder); color:#bbb;}div:focus:before{ content:none; }

  2. lkx开发日志1-项目前的准备

    遇到的问题 不了解github的使用 不能熟练的用Markdown编辑,比如:放入图片 虚拟机的认知也还是有点模糊 解决的方法 参照老师博文给出的链接,好好学习实操一遍 多请教组员,很多小问题便迎刃而 ...

  3. ASP.Net中的Web Resource

    http://support.microsoft.com/kb/910442,这是中文的,机器翻译的,不太容易看懂,英文的是:http://support.microsoft.com/kb/91044 ...

  4. mybatis比较数字或者单字母

    http://blog.csdn.net/alibert/article/details/50177017 <if test="req.queryType == '3'.toStrin ...

  5. CAS学习笔记（二）—— cas server端的login-webflow详细流程

    一.配置文件介绍 关于spring的配置信息只需放入WEB-INF/spring-configuration目录即可,cas启动时会自动加载.这个目录下的spring配置文件几乎不需要改动. 在web ...

  6. workerman centos 7 开机自动启动

    第一步: vim /lib/systemd/system/workerman.service 第二步:复制以下代码保存退出,注意修改你的workerman路径 [Unit] Description=w ...

  7. $.Callbacks()

    <script> var cb = $.Callbacks(); //Callbacks(option) 有4个参数,可以多个参数写一起,空格分隔开 //once 多个fire() 只触发 ...

  8. Super Jumping! Jumping! Jumping!

    Nowadays, a kind of chess game called “Super Jumping! Jumping! Jumping!” is very popular in HDU. May ...

  9. 利用Python实现从百度下载图片到本地磁盘

    import urllib.request import os import re url=r'http://image.baidu.com/search/index?tn=baiduimage&am ...

  10. 空间不支持openssl解决办法

    windows server2003 系统 IIS6.0 ,支付宝担保交易功能不能用,提示您的空间不支持openssl 解决办法如下:1.在C:\WINDOWS 下打开php.ini 将 extens ...