问题描述
以下是源码,点击menu here的时候也是仅仅出现一个小条<%@ page language="java" contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>extjs测试</title><meta http-equiv="pragma" content="no-cache" /><meta http-equiv="cache-control" content="no-cache"/><meta http-equiv="expires" content="0" /><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><link rel="stylesheet" type="text/css" href="css/ext-all.css" /><link rel="stylesheet" type="text/css" href="css/myStyle.css" /><link rel="stylesheet" type="text/css" href="css/icons.css" /><link rel="stylesheet" type="text/css" href="css/examples.css" /><link rel="stylesheet" type="text/css" href="css/column-tree.css" /><link rel="stylesheet" type="text/css" href="css/Spinner.css" /><link rel="stylesheet" type="text/css" href="css/fileuploadfield.css" /><script type="text/javascript" src="js/ext-base.js"></script><script type="text/javascript" src="js/ext-all.js"></script><script type="text/javascript" src="js/ext-lang-zh_CN.js"></script><script type="text/javascript">Ext.onReady(function(){ Ext.BLANK_IMAGE_URL = "../ext/resources/images/default/s.gif"; var loader = new Ext.tree.TreeLoader({dataUrl: 'abc.txt'}); loader.processResponse = function(response, node, callback){ var json = response.responseText; try { var json = eval("("+json+")"); node.beginUpdate(); var o = json["root"]; for(var i = 0, len = o.length; i < len; i++){ var n = this.createNode(o[i]); if(n){ node.appendChild(n); } } node.endUpdate(); if(typeof callback == "function"){ callback(this, node); } }catch(e){ this.handleFailure(response); } }; var testMenu = new Ext.menu.Menu({//菜单容器minWidth:300,maxHeight:500,enableScrolling : true,item:[{id:'1',icon:"icon-info.gif",text:'有本事点我',handler:function(){Ext.MessageBox.alert("","啊!我被击中了!");}},"-",{text:'有本事点我', icon:"icon-info.gif",handler:function(){Ext.MessageBox.alert("","啊!我被击中了!");}}]}); var tree = new Ext.tree.TreePanel({ el: 'tree', loader: loader }); var root = new Ext.tree.AsyncTreeNode({text:'我是根'});tree.on("contextmenu",function(node,e){//contextmenu是右键菜单事件e.preventDefault();//用来防止浏览器弹出它默认的功能菜单 e.stopEvent(); node.select();//当前节点处于选中状态 testMenu.showAt(e.getXY());}); tree.setRootNode(root); tree.render(); root.expand(); var el = Ext.get("test_menu"); el.on("click",function(e){ //menu.showAt(e.getXY());//作用于该位置 testMenu.show(this);//作用于元素上 //e.getXY();//得到事件触发的坐标 }) ;});</script></head><body><div id='tree' style="height:60"></div><div id="test_menu" style="height:60">menu here</div></body></html>
解决方案
var testMenu = new Ext.menu.Menu({//菜单容器 minWidth:300, maxHeight:500, enableScrolling : true, [color=red]item:[{ [/color] [color=darkred]//-->items啊 单词少了s 所以显示不出来[/color]id:'1', icon:"icon-info.gif", text:'有本事点我', handler:function(){ Ext.MessageBox.alert("","啊!我被击中了!"); }},"-",{ text:'有本事点我', icon:"icon-info.gif", handler:function(){ Ext.MessageBox.alert("","啊!我被击中了!"); }}] });
解决方案二:
在树的节点上显示右击菜单,我也是这么做的:contextmenu : function(node ,e) { var m = createContextMenu(node); e.stopEvent(); m.showAt(e.getPoint()); }适合没出现你说的问题,是否是浏览器的问题?