jstree 3.0.0 contextmenu右键单击无法正常工作。显示TypeError:vakata_context.element.html不是函数

时间:2014-05-08 01:06:58

标签: javascript contextmenu jstree

我的代码是渲染树,父,孩子一切都很好,但右键单击contextmenu没有显示。 Firebug显示错误“TypeError:vakata_context.element.html不是函数”。如果我删除了contextmenu插件,那么它会显示默认的浏览器右键单击选项。这是代码。

jsjQuery(document).ready(function () {
    $('#pages-wrapper').jstree({
        'core' : {
            callback:{
                onchange:function(node,tree){
                    document.location='pages.php?action=edit&id='
                    +node.id.replace(/.*_/,'');
                },
                onmove:function(node){
                    var p=$.tree.focused().parent(node);
                    var new_order=[],nodes=node.parentNode.childNodes;
                    for(var i=0;i<nodes.length;++i)
                        new_order.push(nodes[i].id.replace(/.*_/,''));
                    $.getJSON('/ww.admin/pages/move_page.php?id='
                        +node.id.replace(/.*_/,'')+'&parent_id='
                        +(p==-1?0:p[0].id.replace(/.*_/,''))
                        +'&order='+new_order);
                }
            }
        },
        "plugins" : ["contextmenu"],
            'contextmenu':{
                'items':{
                    'create' : {
                        'label' : "Create Page",
                        'icon' : "create",
                        'visible' : function (NODE, TREE_OBJ) {
                            if(NODE.length != 1) return 0;
                            return TREE_OBJ.check("creatable", NODE);
                        },
                        'action':pages_add_subpage,
                        'separator_after' : true
                    },
                    'rename':false,
                    'remove':{
'label' : "Delete Page",
'icon' : "remove",
'visible' : function (NODE, TREE_OBJ) {
if(NODE.length != 1) return 0;
return TREE_OBJ.check("deletable", NODE);
},
'action':pages_delete,
'separator_after' : true
}
                }
            }
        });
        var div=$(  '<div><i>right-click for options</i><br /><br /></div>');
        $('<button>add main page</button>')
        .click(pages_add_main_page)
        .appendTo(div);
        div.appendTo('#pages-wrapper');
    });
function pages_add_main_page(){
pages_new(0);
}
function pages_new(p){
$('<form id="newpage_dialog" action="/ww.admin/pages.php" method="post"><input type="hidden" name="action" value="Insert Page Details" /><input type="hidden" name="special[1]" value="1" /><input type="hidden" name="parent" value="'+p+'" /><table><tr><th>Name</th><td><input name="name" /></td></tr><tr><th>Page Type</th><td><select name="type"><option value="0">normal</option></select></td></tr><tr><th>Associated Date</th><td><input name="associated_date" class="date-human" id="newpage_date" /></td></tr></table></form>')
.dialog({
    modal:true,
    buttons:{
        'Create Page': function() {
            $('#newpage_dialog').submit();
        },
    'Cancel': function() {
        $(this).dialog('destroy');
        $(this).remove();
        }
    }
});
$('#newpage_date').each(convert_date_to_human_readable);
return false;
}
function pages_add_subpage(node,tree){
var p=node[0].id.replace(/.*_/,'');
pages_new(p);
}
function pages_delete(node,tree){
if(!confirm(
"Are you sure you want to delete this page?"))return;
$.getJSON('/ww.admin/pages/delete.php?id='
+node[0].id.replace(/.*_/,''),function(){
document.location=document.location.toString();
});
}

2 个答案:

答案 0 :(得分:21)

一周前我遇到了同样的问题,添加以下css规则解决了我的问题:

.vakata-context { 
     z-index:999 !important; 
} 

答案 1 :(得分:2)

我可以在模态后面看到我的上下文菜单。所以我通过指定比模态更大的z-index来修复它。例如,我的模态有z-index: 10050,我通过执行以下操作解决了问题:

.vakata-context { z-index:10052 !important; }