web页面点击右键显示按钮

server/2024/10/20 3:46:34/

首先声明一个对象,然后把声明的对象,赋值一个function,在对象的function当中再return一个function,在返回的这个function中第一步就是要把按钮的class先移除,不然到后面取消右键显示按钮的时候会失效,按钮依然会显示,不会隐藏,第二步就是命名一个拼接上按钮的html代码,因为html代码中有a标签,a标签有href的属性,需要把href属性设置成javascript:;,可以使用jquery中的find方法找到a标签使用attr设置href属性,也可以直接在拼接的a标签里直接设置href属性,最后使用end和appendTo破坏和追加到body上,return拼接设置好的html代码

var kyoPopupMenu = {};
kyoPopupMenu = (function () {return {sys: function (obj) {$('.popup_menu').remove();popupMenuApp = $('<div class="popup_menu app-menu"><ul><li οnclick="AddRow()"><a menu="menu1"><i class="zi zi_plus"></i> 增明细</a>' +'</li><li οnclick="delRow()"><a menu="menu2"><i class="zi zi_trashalt"></i> 删明细</a></li></ul></div>').find('a').attr('href', 'javascript:;').end().appendTo('body');return popupMenuApp;}}
})();

取消右键,把按钮的隐藏起来,获取到html代码块,使用jquery的on方法给html绑定contextmenu,回调函数,return false,绑定click事件,在click事件的function里把按钮给隐藏起来

//取消右键
$('html').on('contextmenu', function () { return false; }).click(function () {$('.popup_menu').hide();
});

点击右键把按钮显示出来,首先获取一个class,只有在有这个class的元素内点击右键才使用jquery的on方法给获取到的这个class元素绑定contextmenu,回调函数里给上一个形参,申明一个变量赋值为拼接好的html代码的方法,使用坐标轴的方法,计算点击右键的位置,在哪里点击的右键就按钮就显示在什么位置,l赋值为:如果(获取到document元素的宽度减去游览器页面的水平坐标)<拼接html代码的function的宽度就赋值游览器页面的水平坐标减去拼接html代码的function的宽度,否者就直接赋值为游览器页面的水平坐标,t赋值为:如果(获取到document元素的高度减去游览器页面的垂直坐标)<拼接html代码的function的高度就赋值游览器页面的垂直坐标减去拼接html代码的function的高度,否者就直接赋值为游览器页面的垂直坐标。l和t的值是使用三目运算符计算的到的。申明的变量的css显示在左边l和邮编t计算得到的位置

//桌面点击右击
$('.Table').on('contextmenu', function (e) {var popupmenu = kyoPopupMenu.sys();l = ($(document).width() - e.clientX) < popupmenu.width() ? (e.clientX - popupmenu.width()) : e.clientX;t = ($(document).height() - e.clientY) < popupmenu.height() ? (e.clientY - popupmenu.height()) : e.clientY;popupmenu.css({ left: l, top: t }).show();return false;
});

http://www.ppmy.cn/server/21133.html

相关文章

[Linux_IMX6ULL驱动开发]-设备树简述

目录 设备树的引入 设备树具体框架 设备树的属性 label address-cells和size-cells compatible model status reg 设备树的编译 内核对设备树的处理 plateform_device如何对应plateform_driver 设备树的引入 之前已经学习了解过了总线驱动模型的概念&#xff0c;也…

智能驾驶+网络安全

在智能驾驶场景下&#xff0c;安全问题一直是一个持续热点。 针对车机模块不被黑客利用Linux的漏洞攻击&#xff0c;可以采取以下几种方式来提高安全性&#xff1a; 安全设计和防护&#xff1a;在设计车机模块时&#xff0c;需要考虑安全性&#xff0c;并采取相应的安全防护措施…

python使用pushplus将消息推送到微信

编程序的时候,有时需要将提醒信息发送到微信,便于时刻掌握情况。 pushplus就很方便的解决了这个问题。 一、登陆网站并获取自己的token 网址:pushplus(推送加)-破壳网络科技旗下微信消息推送平台 二、编写代码(我已经写出一个函数,方便调用) import requests import …

kubectl无法使用清理磁盘

执行Kubectl get pods 报错如下&#xff1a; # kubectl get nodes The connection to the server <master>:6443 was refused - did you specify the right host or port?查看占用磁盘&#xff1a; df -h 查看占用100%的数据 df -h | grep 100% 检查环境变量&#xff…

static为什么不能修饰String类

在Java中&#xff0c;static 关键字用于修饰类成员&#xff08;字段、方法、内部类&#xff09;以及代码块&#xff0c;它主要表示这些成员或代码块与类本身关联&#xff0c;而不是与类的实例关联。当你提到 static 不能修饰 String 类时&#xff0c;我猜你可能是在思考为什么 …

Vue2slot插槽(理解与应用)

1、插槽的概念 插槽&#xff08;Slot)是vue为组件的封装者提供的能力。允许开发者在封装组件时&#xff0c;把不确定的、希望由用户指定的部分定义为插槽。 举个例子&#xff1a;组件好比小霸王游戏机&#xff0c;插槽就是游戏机的插口&#xff0c;看用户插什么卡&#xff0c;就…

Event Loop中的 microtask 与 macrotask

JavaScript 中的事件循环是一种机制&#xff0c;用于管理异步代码的执行顺序。这种机制确保了 JavaScript 在执行事件处理程序、回调函数和其他异步操作时的顺序和效率。事件循环基于单线程的执行模型&#xff0c;能够避免阻塞代码的执行 事件循环的主要概念是事件队列和事件循…

php 使用链接接收两个参数

要在 PHP 中从链接接收两个参数&#xff0c;您可以使用超链接&#xff08; 标签&#xff09;并将参数附加到链接的 URL 中。在 PHP 中&#xff0c;您可以从 URL 中提取这些参数以供后续处理。下面是一个简单的示例代码&#xff0c;演示如何从链接接收两个参数&#xff1a; 假设…