[英]jQuery contextMenu disable items based on div content
I've been going trough documents of this plugin and it looked promising, but at the end I wasn't able to find out that what I was looking for. 我一直在浏览该插件的文档,它看上去很有前途,但是最后我还是找不到我想要的东西。
http://medialize.github.com/jQuery-contextMenu/docs.html http://medialize.github.com/jQuery-contextMenu/docs.html
Here is what I wanted trough example, this is example of context menu items 这是我想要的槽示例,这是上下文菜单项的示例
$.contextMenu({
selector: '.context-menu-one',
callback: function(key, options) {
var m = "clicked: " + key;
window.console && console.log(m) || alert(m);
},
items: {
"item1": {name: "Clickable", icon: "edit"},
"item2": {
name: "Disabled",
icon: "cut",
disabled: function(key, opt) {
// this references the trigger element
return !this.data('cutDisabled');
}
}
}
});
. 。 If my div ( context-menu-one
) has some content inside like <span class="test">x</span>
disable or enable menu based on that. 如果我的div( context-menu-one
)内部有一些内容,例如<span class="test">x</span>
基于此禁用或启用菜单。
So in the case above if my div( context-menu-one
) has span with class test
that has textvalue x
disable menu item2 因此,在上述情况下,如果我的div( context-menu-one
)具有带有textvalue的类test
跨度x
禁用菜单item2
How would one do that? 一个人怎么做? doesn't have to be code, leading me to good direction = good code if possible at all 不必是代码,如果可能的话,可以带我朝正确的方向=好的代码
Edit: 编辑:
Here is jsfiddle example : 这是jsfiddle示例:
http://jsfiddle.net/XZEUN/2/ http://jsfiddle.net/XZEUN/2/
So because first context-menu-one
has span with class x the item2 should be disabled, but not for other one 因此,因为第一个context-menu-one
跨度为x类,所以应该禁用item2,但不要禁用其他context-menu-one
you need to define your own events like in this fiddle 您需要像这个小提琴一样定义自己的事件
html html
<div class="context-menu-one box menu-1">
<strong>right click me</strong>
<span data-item="edit"></span>
</div>
javascript javascript
events: {
show: function(opt) {
var m = opt.$menu;
$(this).find('span[data-item]').each(function(i, e) { //<-- this search for all span with data-item attribute
var p = $(e).data('item') + 'Disabled'; //<-- here i compose editDisabled
if (m.data(p) === true) m.data(p, 1); //<-- this is for mantain previuos disabling
else m.data(p, true);
});
m = null; //<-- this for breaking possible circular references/memory leaks
},
hide: function(opt) {
var m = opt.$menu;
$(this).find('span[data-item]').each(function(i, e) {
var p = $(e).data('item') + 'Disabled';
if (m.data(p) === 1) m.data(p, true); //<-- this reset the previuos disabling
else m.removeData(p);
});
m = null;
}
}
If you want to disable a context menu binded to an specific selector you can do something like this: 如果要禁用绑定到特定选择器的上下文菜单,可以执行以下操作:
$.contextMenu( 'destroy', '.context-menu-one' );
See example here: 在这里查看示例:
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.