/** *****以下内容可以修改************** */
// mname是菜单对应的名称,数组的个数必须与下面murl对应
var keyword;
var mname;
var murl;
/**
* 获取选中文字
* @return
*/
function getSelectedText() {
var text ;
if (window.getSelection) {
text = window.getSelection().toString();
}else if (document.getSelection) {
text = document.getSelection();
}else if (document.selection) {
text = document.selection.createRange().text;
}
//alert(text+"----"+keyword);
if(text!=""){
keyword = text;
}
}
function closeyou(){
event.returnValue = false;
}
/**
* 复制
* @param keyword
* @return
*/
function copyit(textit) {
if (window.clipboardData) {
window.clipboardData.setData("Text",textit);
} else {
var flashcopier = 'flashcopier';
if(!document.getElementById(flashcopier)) {
var divholder = document.createElement('div');
divholder.id = flashcopier;
document.body.appendChild(divholder);
}
document.getElementById(flashcopier).innerHTML = '';
var divinfo = '<embed src="_clipboard.swf" FlashVars="clipboard='+textit+'" width="0" height="0" type="application/x-shockwave-flash"></embed>';
document.getElementById(flashcopier).innerHTML = divinfo;
}
}
var ph = 21, mwidth = 50;// ph每条选项的高度,菜单的总宽度
var bgc = "#eee", txc = "black";// 菜单没有选中的背景色和文字色
var cbgc = "darkblue", ctxc = "white";// 菜单选中的选项背景色和文字色
/** **************以下代码请不要修改***************** */
var mover = "this.style.background='" + cbgc + "';this.style.color='" + ctxc + "';"
var mout = "this.style.background='" + bgc + "';this.style.color='" + txc + "';"
function fresh() {
mlay.style.background = bgc;
mlay.style.color = txc;
mlay.style.width = mwidth;
mlay.style.height = mname.length * ph;
var h = "<table width=60 height=" + mname.length * ph
+ "px cellpadding=0 cellspacing=0 border=1>";
var i = 0;
for (i = 0; i < mname.length; i++) {
h += "<tr align=left height=" + ph + " onclick=\"" + murl[i]
+ "\" onMouseover=\"" + mover + "\" onMouseout=\"" + mout
+ "\"><td style='font-size:9pt;'> " + mname[i]+"</td></tr>";
}
h += "</table>";
//alert(h);
//document.write(h);
mlay.innerHTML = h;
}
/**
* 右键事件
*/
function oncontextmenuTest() {
/*getSelectedText();
//没有选择任何文本
if(keyword == undefined){
return true; //继续弹出原始的右键菜单
}*/
mname = new Array("共享", "修改", "删除"
);
//murl是菜单对应的操作,可以是任意javascript代码但是要注意不要在里面输入\",只能用'
//如果要实现跳转可以这样window.location='url';
murl = new Array(
"subNewQuery('"+keyword+"');",
"copyit('"+keyword+"');",
"window.open('http://10.137.43.25:8888/searcher','_self','');"
);
fresh();
sctop = document.documentElement.scrollTop; //被卷去的高
scleft = document.documentElement.scrollLeft;//被卷去的宽
mlay.style.display = "";
mlay.style.pixelTop = event.clientY + sctop;
mlay.style.pixelLeft = event.clientX + scleft;
return false;
}
function showoff() {
mlay.style.display = "none";
keyword=undefined;//重新赋给未定义,右击就没菜单了。
}
function subNewQuery(keyword){
document.getElementById("newkeyword").value=keyword;
document.getElementById("newquery").submit();
}
相关推荐
通过实践和修改,可以创建出适应自己项目需求的、既实用又美观的JavaScript右键菜单。 总结,JavaScript右键菜单是增强网页交互性和用户体验的重要工具。理解其工作原理,掌握创建和优化的方法,将使你的网页更加...
本文将深入探讨如何使用JavaScript实现右键菜单,特别是如何动态添加菜单项,并在菜单项中添加图标、文本以及处理点击事件。此外,我们还将讨论在不同浏览器(如IE、Firefox和Chrome)中的兼容性问题。 首先,右键...
本文将深入探讨如何利用JavaScript实现自定义鼠标右键菜单的功能。 首先,我们需要理解浏览器的默认行为。当用户在网页上点击鼠标右键时,通常会弹出一个包含基本浏览器操作(如"查看源代码"、"保存页面"等)的标准...
总的来说,结合使用JavaScript实现的树形菜单和右键菜单,可以提供一个高效且直观的用户界面,让用户在复杂的层级数据中进行导航和操作。这种技术在内容管理系统(CMS)、文件管理工具以及其他需要展现层次关系的Web...
在JavaScript(JS)中,自定义右键菜单是一项常见的需求,尤其在开发Web应用程序时,为了提供更加个性化和功能丰富的用户体验。默认情况下,浏览器提供的右键菜单只包含基本的选项,如“复制”、“粘贴”等。通过...
4. jQuery或Vue.js等框架:使用这些框架可以简化JavaScript代码,提高开发效率,同时提供更好的DOM操作和事件处理。 三、自定义Web右键菜单的设计考虑 1. 一致性:菜单设计应遵循平台和网站的一致性原则,使用户能...
js 右键菜单,直接使用,修改方便
标题“echarts右键菜单实例 --- 不修改源码”表明我们将探讨如何在ECharts图表上添加右键菜单,而无需直接修改ECharts的源代码。这意味着我们将通过ECharts的API和事件监听来实现这一功能,这是一个常见的最佳实践,...
IE右键菜单通常包括诸如“复制”、“粘贴”、“保存图片为”等常见功能,而使用JavaScript,开发者可以自由设计类似这样的菜单项,并根据需要添加更多自定义选项。 JavaScript是一种广泛应用于Web开发的脚本语言,...
在HTML+JavaScript右键菜单的实现中,JSP可能被用作后端服务,处理与菜单相关的数据请求或逻辑,例如根据用户状态或权限动态生成菜单项。 实现步骤如下: 1. 创建HTML结构:在HTML文件中,定义一个用于存放菜单的...
总结来说,OpenLayers扩展右键菜单是一项提高地图应用交互性的技术,涉及到JavaScript事件处理、DOM操作、CSS样式设计以及地图交互逻辑。通过这样的扩展,我们可以让地图应用变得更加灵活且符合用户的使用习惯。
这次我们要分享的也是一款JavaScript右键菜单插件,它的外观是基于Bootstrap的,因此UI比之前那款要漂亮许多,另外这款右键菜单插件也支持自定义区域菜单显示功能,你可以在初始化的时候指定需要弹出菜单的网页区域...
高德地图API并没有直接提供右键菜单功能,但开发者可以结合JavaScript事件监听和自定义函数来实现。具体步骤包括: 1. 监听地图的`contextmenu`(右键点击)事件。 2. 在事件触发时,阻止浏览器默认的右键菜单显示,...
使用上述提供的JavaScript库可以大大简化这些步骤,它们通常已经封装了大部分逻辑,只需按照文档配置即可快速创建功能完备的右键菜单。 总结来说,右键菜单是提升Web应用交互性的关键元素,通过JavaScript和相关库...
js实现右键菜单效果,测试可用(源代码)
在JavaScript(JS)中,自定义右键菜单是一项常见的需求,尤其在网页开发中,它能够为用户提供更个性化的交互体验。本教程将详细介绍如何利用JS实现一个通用且最多支持两级菜单的自定义右键菜单小控件。 首先,我们...
此时,你需要在`iframe`内部的页面中处理右键菜单的禁用,或者使用`postMessage`和`message`事件进行跨域通信。 在提供的`iframeNoContextMenu`压缩包文件中,可能包含了实现这一功能的完整代码示例,包括HTML、CSS...
通过监听`contextmenu`事件并调用`preventDefault()`方法,可以阻止浏览器的默认右键菜单。而在SVG中,我们可以结合CSS和JavaScript创建自定义菜单,以提供更丰富的用户体验。这些技术广泛应用于各种Web应用程序,...
javascript 右键菜单,比较好用,自定义的,可以根据需要自己改动
"js多级菜单设置"是指在右键菜单中嵌套子菜单,形成层次结构。例如,一级菜单可以是“编辑”、“查看”,二级菜单则可能是“复制”、“粘贴”等。这样的设计使得用户能更快地找到和执行所需的功能,同时保持界面整洁...