在IE8/7中创建网格时dijit.Menu的奇怪行为
我有一个带有边框容器的简单页面。顶部区域是一个简单的ContentPange，中心区域是一个TabContainer。在顶部区域有一个按钮，用于创建dijit.菜单并将其绑定到顶部区域。还有另一个按钮，用于创建EnhancedGrid并将其添加到TabContainer。问题如下： 场景1）如果创建菜单，然后单击鼠标右键，则只要在首次显示菜单之前未创建网格，菜单将正确显示 场景2）任何其他选项（创建菜单、网格，然后右键单击，或创建网格、菜单，然后右键单击）都会在页面中引起闪烁（如页面正在调整大小）。滚动条将在主体右侧显示一秒钟，菜单将显示一秒钟，然后消失。如果再次单击，将显示菜单，但打开子菜单将关闭主菜单，子菜单中的选项将不起作用 我已经能够创建一个小测试用例。该行为可在1.8之前的任何版本的dojo中复制。我还看到，如果边框容器的高度差大于100%（宽度不影响），则菜单工作正常 我相信这个问题与眨眼有关。似乎在显示菜单的那一刻，布局正在调整大小，而在那一刻，菜单失去了焦点并自动关闭在IE8/7中创建网格时dijit.Menu的奇怪行为,menu,dojo,Menu,Dojo,我有一个带有边框容器的简单页面。顶部区域是一个简单的ContentPange，中心区域是一个TabContainer。在顶部区域有一个按钮，用于创建dijit.菜单并将其绑定到顶部区域。还有另一个按钮，用于创建EnhancedGrid并将其添加到TabContainer。问题如下： 场景1）如果创建菜单，然后单击鼠标右键，则只要在首次显示菜单之前未创建网格，菜单将正确显示 场景2）任何其他选项（创建菜单、网格，然后右键单击，或创建网格、菜单，然后右键单击）都会在页面中引起闪烁（如页面正在调整大小
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title> - demo</title>
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/dojo/1.7.4/dojo/dojo.js' djConfig="parseOnLoad: true, locale: 'en-us'"></script>
<script>
dojo.require("dijit.layout.TabContainer");
dojo.require("dijit.layout.ContentPane");
dojo.require("dojox.grid.EnhancedGrid");
dojo.require("dojo.data.ItemFileWriteStore");
dojo.require("dojox.grid.enhanced.plugins.NestedSorting");
dojo.require("dojox.grid.enhanced.plugins.Menu");
dojo.require("dijit.Menu");
dojo.require("dijit.layout.BorderContainer");
dojo.require("dojox.layout.ContentPane");
</script>
<style type='text/css'>
@import url('http://ajax.googleapis.com/ajax/libs/dojo/1.7.4/dojox/grid/enhanced/resources/tundra/EnhancedGrid.css');
@import url('http://ajax.googleapis.com/ajax/libs/dojo/1.7.4/dijit/themes/tundra/tundra.css');
</style>
<style type="text/css">
html, body { overflow: auto; width: 100%; height: 100%; margin: 0; }
</style>
<script>
function createMenu(){
var sMenu = new dijit.Menu({});
var pSubMenu = new dijit.Menu();
// Para enviar por mail
pSubMenu.addChild(new dijit.MenuItem({
label: "email 1",
onClick: function(e){
alert(1)
}
}));
pSubMenu.addChild(new dijit.MenuItem({
label: "email 2",
onClick: function(e){
alert(2)
}
}));
// Añadimos el submenu a la entrada de SendTo
sMenu.addChild(new dijit.PopupMenuItem({
label: "SendTo",
popup: pSubMenu
}));
sMenu.addChild(new dijit.MenuItem({
label: "Open"
}))
sMenu.startup();
return sMenu;
}
</script>
</head>
<body class="tundra eco">
<div id="BorderContainerLevel1" dojoType="dijit.layout.BorderContainer" style="width: 100%; height: 100%; background: none; border:none; padding:10px 0px 0px 0px;">
<div id="pane-test-1" dojoType="dijit.layout.ContentPane" region="top" style="height: 105px; "><!-- z-index:10-->
La cabecera
<button dojoType="dijit.form.Button" type="button" onclick='launch()'>Create grid</button>
<button dojoType="dijit.form.Button" type="button" onclick='launchMenu()'>Create Menu</button>
</div>
<script>
function launch(){
var layout = [[
{
name: ' ',
hidden: true,
field: 'idDocument'},
{
name: ' ',
field: 'contentType',
width: '8%'},
{
name: "Name",
field: 'name',
width: '62%'},
{
name: "Date",
field: 'date',
width: '20%'},
{
name: "Size",
field: 'size',
width: '10%'}
]];
var i = 0;
var gridId = "grid_" + i
var grid = new dojox.grid.EnhancedGrid({
id: gridId,
query: {
idDocument: '*'
},
title:"titulo",
structure: layout
})
bankerTabContainer.addChild(grid)
grid.startup();
var myJson = {"identifier":"idDocument","items":[{"contentType":"pdf","date":"2011-10-26T16:10:45","documentType":"USERDOCUMENT","documentTypeDescription":"User Document","idDocument":534044,"idUser":"OFFMARA","name":"test II Modules.pdf","size":15704}]}
grid.setStore(new dojo.data.ItemFileWriteStore({
data: myJson
}));
}
</script>
<div dojoType="dijit.layout.TabContainer" id="bankerTabContainer" jsId="bankerTabContainer" style="height: 100%;width: 100%; border: 0px; padding: 0px;" region="center"></div>
</div>
<script>
function launchMenu(){
dijit.byId('BorderContainerLevel1').resize();
var menu1 = createMenu();
menu1.bindDomNode(dojo.byId("pane-test-1"));
}
</script>
</body>
</html>
-演示
require（“dijit.layout.TabContainer”）；
require（“dijit.layout.ContentPane”）；
require（“dojox.grid.EnhancedGrid”）；
require（“dojo.data.ItemFileWriteStore”）；
require（“dojox.grid.enhanced.plugins.NestedSorting”）；
require（“dojox.grid.enhanced.plugins.Menu”）；
dojo.require（“dijit.Menu”）；
require（“dijit.layout.BorderContainer”）；
require（“dojox.layout.ContentPane”）；
@导入url（'http://ajax.googleapis.com/ajax/libs/dojo/1.7.4/dojox/grid/enhanced/resources/tundra/EnhancedGrid.css');
@导入url（'http://ajax.googleapis.com/ajax/libs/dojo/1.7.4/dijit/themes/tundra/tundra.css');
html，正文{溢出：自动；宽度：100%；高度：100%；边距：0；}
函数createMenu（）{
var sMenu=new dijit.Menu（{}）；
var pSubMenu=new dijit.Menu（）；
//Para enviar por邮件
pSubMenu.addChild（新的dijit.MenuItem({
标签：“电子邮件1”，
onClick：函数（e）{
警报（1）
}
}));
pSubMenu.addChild（新的dijit.MenuItem({
标签：“电子邮件2”，
onClick：函数（e）{
警报（2）
}
}));
//Añadimos el子菜单A la entrada de SendTo
sMenu.addChild（新的dijit.PopupMenuItem）({
标签：“发送到”，
弹出：pSubMenu
}));
sMenu.addChild（新的dijit.MenuItem({
标签：“打开”
}))
sMenu.startup（）；
返回sMenu；
}
卡贝塞拉酒店
创建网格
创建菜单
函数启动（）{
变量布局=[[
{
名称：“”，
隐藏：是的，
字段：'idDocument'}，
{
名称：“”，
字段：“contentType”，
宽度：“8%”，
{
姓名：“姓名”，
字段：“名称”，
宽度：'62%'}，
{
姓名：“日期”，
字段：“日期”，
宽度：“20%”，
{
名称：“尺寸”，
字段：“大小”，
宽度：“10%”
]];
var i=0；
var gridId=“网格”+i
var grid=new dojox.grid.EnhancedGrid({
id:gridId，
查询：{
idDocument:“*”
},
标题：“提图洛”，
结构：布局
})
bankerTabContainer.addChild（网格）
grid.startup（）；
var myJson={“identifier”：“idDocument”，“items”：[{“contentType”：“pdf”，“date”：“2011-10-26T16:10:45”，“documentType”：“USERDOCUMENT”，“documentTypeDescription”：“User Document”，“idDocument”：534044，“idUser”：“OFFMARA”，“name”：“test II Modules.pdf”，“size”：15704}]
grid.setStore（新的dojo.data.ItemFileWriteStore({
数据：myJson
}));
}
函数启动菜单（）{
byId（'borderContainerLevel'）.resize（）；
var menu1=createMenu（）；
menu1.bindDomNode（dojo.byId（“pane-test-1”）；
}