网页中右键功能的实现方法之contextMenu的使用
网页中右键功能的实现方法之contextMenu的使用
本文介绍一种网页中实现右键功能的方案–contextMenu。
1.下载
下载地址
https://github.com/swisnl/jquery-contextMenu
下载得到压缩文件jQuery-contextMenu-master.zip
解压后,使用dist目录下css、js。
2.使用方法
使用步骤:
(1) 引用css、js。
(2) html、js代码。
简单例子如下:
代码test.html:http://
$(function() {
$.contextMhttp://enu({
selector: '.context-menu-one',
callback: function(key, options) {
var m = "clicked: " + key;
window.console && console.log(m) || alert(m);
},
items: {
"edit": {name: "Edit", icon: "edit"},
"cut": {name: "Cut", icon: "cut"},
copy: {name: "Copy", icon: "copy"},
"paste": {name: "Paste", icon: "paste"},
"delete": {name: "Delete", icon: "delete"},
"sep1": "---------",
"quit": {name: "Quit", icon: function(){
return 'context-menu-icon context-menu-icon-quit';
}}
}
});
$('.context-menu-one').on('click', function(e){
console.log('clickedhttp://', this);
})
});