我正在 ExtJS 4.2.0 中开发应用程序并使用 Chrome 作为我的开发浏览器。我注意到当我隐藏下拉菜单时，黑色方 block 出现在它们的位置。我假设这不应该发生!有没有其他人遇到过这种情况？
我使用的是 ExtJs 4.2.0 和 Chrome 27.0.1453.94 m。
谢谢!
更新
经过一番调查后，我发现将 ExtJS 与 Javascript Infovis 工具包 (http://philogb.github.io/jit/) 结合使用时会发生这种情况。我设法在这里可靠地重现了问题:
<html>
<head>
<title>Black Box Experiment</title>
<script type="text/javascript" src="http://philogb.github.io/jit/static/v20/Jit/jit-yc.js"></script>
<link rel="stylesheet" type="text/css" href="http://cdn.sencha.io/ext-4.2.0-gpl/resources/css/ext-all.css">
<script type="text/javascript" src="http://cdn.sencha.io/ext-4.2.0-gpl/ext-all-debug.js"></script>
</head>
<body>
<script type="text/javascript">
Ext.onReady(function(){
//some data to put in the chart
var data = {
"name": "Test1",
"data": {
"id": "1"
}
};
//Create a new ST instance
var st = new $jit.ST({
injectInto: 'infovis',
duration: 0,
levelDistance: 50,
orientation: "top",
Navigation: {
enable:false,
panning:true
},
Node: {
height: 30,
width: 150,
autoHeight: false,
autoWidth: false,
type: 'rectangle',
overridable: true
},
NodeStyles: {
enable: true,
stylesHover: {
'color': '#dd3333'
},
duration: 700
},
Edge: {
type: 'bezier',
overridable: true
}
});
//load json data
st.loadJSON(data);
st.compute();
//emulate a click on the root node.
st.onClick(st.root);
//create our extjs panel for the buttons
Ext.create(Ext.panel.Panel,{
title: "Test panel",
width: 300,
height: 100,
items: [
{
xtype: 'button',
text: 'Open/Close Menu',
menu: [
{text: 'button 1'},
{text: 'button 2'},
{text: 'button 3'},
{text: 'button 4'},
{text: 'button 5'},
{text: 'button 6'}
]
},
{
xtype: 'button',
text: 'Click to open an alert - a black square will appear',
handler: function(){
Ext.Msg.alert("Test","A black box should now be appearing where the menu button is.");
}
}
],
renderTo: Ext.getBody()
});
});
</script>
<div id="infovis" style="width: 300px; height: 300px; margin: auto; overflow: scroll; border: 1px solid black;"></div>
</body>
</html>
在上面的示例中，请执行以下步骤来重现问题: 1.点击“打开/关闭菜单”按钮两次(一次打开，一次关闭) 2. 单击“警报”按钮。我们刚刚关闭的菜单位置应该会出现一个黑框。
还有人看到这个吗？
最佳答案
我们遇到了完全相同的问题。这似乎是一个(仅限 Windows)Chrome 错误，与 visibility: hidden css 规则 Ext 默认用于隐藏下拉列表。
解决方法是更改菜单配置中的 css 隐藏技术:
{
...
menu: {
items: [
...
],
hideMode: 'display'
}
}
关于javascript - 为什么 Chrome 中出现黑色方 block ？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16922244/