Fatal编程技术网

Internet explorer Extjs工具提示、iFrame和IE=>；问题

internet-explorer iframe extjs openlayers

Internet explorer Extjs工具提示、iFrame和IE=>；问题,internet-explorer,iframe,extjs,openlayers,Internet Explorer,Iframe,Extjs,Openlayers,我有一个使用OpenLayers、Extjs和GeoExt的应用程序。我的应用程序运行正常，但我需要将其放置在另一个页面的IFrame中。执行此操作时，Internet Explorer中的工具栏将无响应 原因是Ext.QuickTips.init（）。注释掉这一行，一切都正常-当然除了快速提示=） 但为什么会产生问题呢？是因为我用错了、放错了还是因为它不喜欢Internet Explorer和IFrames 链接： IFrame页面： <!DOCTYPE HTML PUBLIC "-

我有一个使用
OpenLayers
、
Extjs
和
GeoExt
的应用程序。我的应用程序运行正常，但我需要将其放置在另一个页面的
IFrame
中。执行此操作时，Internet Explorer中的工具栏将无响应

原因是Ext.QuickTips.init（）。注释掉这一行，一切都正常-当然除了快速提示=）

但为什么会产生问题呢？是因为我用错了、放错了还是因为它不喜欢Internet Explorer和
IFrames

链接：

IFrame页面：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
    <body>
        <iframe height="660" src="http://www.gis34.dk/doctype.html" width="660">
          <p>This browser does not support <i>frames</i>.</p>
        </iframe>
    </body>
</html>

<!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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="text/javascript" language="javascript">
        var map;
        var mapPanel;
        var mainViewport;
        var toolbarItems = [];
    </script>
    <link href="/Libraries/Ext/resources/css/ext-all.css" type="text/css"
    rel="stylesheet" />
    <link href="/Libraries/GeoExt/resources/css/geoext-all-debug.css" type="text/css"
    rel="stylesheet" />
    <link href="/CSS/Extjs.css" type="text/css" rel="stylesheet" />
    <link href="/CSS/OpenLayers.css" type="text/css" rel="stylesheet" />
    <link href="/CSS/Poseidon.css" type="text/css" rel="stylesheet" />
</head>

<body>
    <script src="/Libraries/OpenLayers/OpenLayers.js" type="text/javascript"></script>
    <script src="/Libraries/Ext/adapter/ext/ext-base-debug.js" type="text/javascript"></script>
    <script src="/Libraries/Ext/ext-all-debug.js" type="text/javascript"></script>
    <script src="/Libraries/GeoExt/lib/GeoExt.js" type="text/javascript"></script>
    <script src="http://www.openstreetmap.org/openlayers/OpenStreetMap.js"
    type="text/javascript"></script>
    <div id="map">
    </div>
    <script type="text/javascript">
        Ext.onReady(function() {
            Ext.QuickTips.init(); // Uncomment this line!

            Ext.BLANK_IMAGE_URL = '/Libraries/Ext/resources/images/default/s.gif';

            var layer = new OpenLayers.Layer.OSM.Mapnik('OpenStreetMap Mapnik', {
                sphericalMercator: true
            }, {
                isBaseLayer: true
            });

            var mapOptions = {
                projection: 'EPSG:900913',
                units: 'm',
                maxExtent: new OpenLayers.Bounds(1390414.0280576, 7490505.7050394, 1406198.2743956, 7501990.3685372),
                minResolution: '0.125',
                maxResolution: '1000',
                restrictedExtent: new OpenLayers.Bounds(1390414.0280576, 7490505.7050394, 1406198.2743956, 7501990.3685372),
                controls: [
                    ]
            };
            map = new OpenLayers.Map('', mapOptions);

            var Navigation = new OpenLayers.Control.Navigation();
            action = new GeoExt.Action({
                control: new OpenLayers.Control.ZoomBox({
                    out: false
                }),
                map: map,
                tooltip: "Zoom in",
                iconCls: 'icon-zoom-in',
                toggleGroup: 'mapTools',
                group: 'mapTools'
            });
            toolbarItems.push(action);
            action = new GeoExt.Action({
                control: new OpenLayers.Control.ZoomBox({
                    out: true
                }),
                map: map,
                tooltip: "Zoom out",
                iconCls: 'icon-zoom-out',
                toggleGroup: 'mapTools',
                group: 'mapTools'
            });
            toolbarItems.push(action);

            action = new GeoExt.Action({
                control: new OpenLayers.Control.ZoomToMaxExtent(),
                map: map,
                iconCls: 'icon-zoom-max-extent',
                tooltip: 'Zoom helt ud'
            });
            toolbarItems.push(action);
            map.addControl(Navigation);
            map.addLayer(layer);

            mapPanel = new GeoExt.MapPanel({
                border: true,
                id: 'mapPanel',
                region: "center",
                map: map,
                tbar: toolbarItems
            });
            mainViewport = new Ext.Viewport({
                layout: "fit",
                hideBorders: true,
                items: {
                    layout: "border",
                    deferredRender: false,
                    items: [
                        mapPanel
                        ]
                }
            });
        });
    </script>
</body>
</html>


此浏览器不支持框架
应用程序页面：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
    <body>
        <iframe height="660" src="http://www.gis34.dk/doctype.html" width="660">
          <p>This browser does not support <i>frames</i>.</p>
        </iframe>
    </body>
</html>

<!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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="text/javascript" language="javascript">
        var map;
        var mapPanel;
        var mainViewport;
        var toolbarItems = [];
    </script>
    <link href="/Libraries/Ext/resources/css/ext-all.css" type="text/css"
    rel="stylesheet" />
    <link href="/Libraries/GeoExt/resources/css/geoext-all-debug.css" type="text/css"
    rel="stylesheet" />
    <link href="/CSS/Extjs.css" type="text/css" rel="stylesheet" />
    <link href="/CSS/OpenLayers.css" type="text/css" rel="stylesheet" />
    <link href="/CSS/Poseidon.css" type="text/css" rel="stylesheet" />
</head>

<body>
    <script src="/Libraries/OpenLayers/OpenLayers.js" type="text/javascript"></script>
    <script src="/Libraries/Ext/adapter/ext/ext-base-debug.js" type="text/javascript"></script>
    <script src="/Libraries/Ext/ext-all-debug.js" type="text/javascript"></script>
    <script src="/Libraries/GeoExt/lib/GeoExt.js" type="text/javascript"></script>
    <script src="http://www.openstreetmap.org/openlayers/OpenStreetMap.js"
    type="text/javascript"></script>
    <div id="map">
    </div>
    <script type="text/javascript">
        Ext.onReady(function() {
            Ext.QuickTips.init(); // Uncomment this line!

            Ext.BLANK_IMAGE_URL = '/Libraries/Ext/resources/images/default/s.gif';

            var layer = new OpenLayers.Layer.OSM.Mapnik('OpenStreetMap Mapnik', {
                sphericalMercator: true
            }, {
                isBaseLayer: true
            });

            var mapOptions = {
                projection: 'EPSG:900913',
                units: 'm',
                maxExtent: new OpenLayers.Bounds(1390414.0280576, 7490505.7050394, 1406198.2743956, 7501990.3685372),
                minResolution: '0.125',
                maxResolution: '1000',
                restrictedExtent: new OpenLayers.Bounds(1390414.0280576, 7490505.7050394, 1406198.2743956, 7501990.3685372),
                controls: [
                    ]
            };
            map = new OpenLayers.Map('', mapOptions);

            var Navigation = new OpenLayers.Control.Navigation();
            action = new GeoExt.Action({
                control: new OpenLayers.Control.ZoomBox({
                    out: false
                }),
                map: map,
                tooltip: "Zoom in",
                iconCls: 'icon-zoom-in',
                toggleGroup: 'mapTools',
                group: 'mapTools'
            });
            toolbarItems.push(action);
            action = new GeoExt.Action({
                control: new OpenLayers.Control.ZoomBox({
                    out: true
                }),
                map: map,
                tooltip: "Zoom out",
                iconCls: 'icon-zoom-out',
                toggleGroup: 'mapTools',
                group: 'mapTools'
            });
            toolbarItems.push(action);

            action = new GeoExt.Action({
                control: new OpenLayers.Control.ZoomToMaxExtent(),
                map: map,
                iconCls: 'icon-zoom-max-extent',
                tooltip: 'Zoom helt ud'
            });
            toolbarItems.push(action);
            map.addControl(Navigation);
            map.addLayer(layer);

            mapPanel = new GeoExt.MapPanel({
                border: true,
                id: 'mapPanel',
                region: "center",
                map: map,
                tbar: toolbarItems
            });
            mainViewport = new Ext.Viewport({
                layout: "fit",
                hideBorders: true,
                items: {
                    layout: "border",
                    deferredRender: false,
                    items: [
                        mapPanel
                        ]
                }
            });
        });
    </script>
</body>
</html>


var映射；
向量映射面板；
var主视口；
var-toolbarItems=[]；
Ext.onReady（函数（）{
Ext.QuickTips.init（）；//取消对此行的注释！
Ext.BLANK_IMAGE_URL='/Libraries/Ext/resources/images/default/s.gif'；
var layer=new OpenLayers.layer.OSM.Mapnik（'OpenStreetMap-Mapnik'{
球形计算器：正确
}, {
isBaseLayer：对
});
变量映射选项={
预测：‘EPSG:900913’，
单位：'m'，
maxExtent:新的OpenLayers.Bounds（1390414.028057617490505.70503941406198.27439567501990.3685372），
最小分辨率：“0.125”，
maxResolution:'1000'，
受限扩展：新的OpenLayers.Bounds（1390414.028057674990505.70503941406198.27439567501990.3685372），
控制：[
]
};
map=newOpenLayers.map（“”，mapOptions）；
var Navigation=new OpenLayers.Control.Navigation（）；
action=新地理外部操作({
控件：新建OpenLayers.control.ZoomBox({
出局：错
}),
地图：地图，
工具提示：“放大”，
iconCls:'图标放大'，
toggleGroup:'mapTools'，
组：“mapTools”
});
工具栏项。推送（操作）；
action=新地理外部操作({
控件：新建OpenLayers.control.ZoomBox({
出局：是的
}),
地图：地图，
工具提示：“缩小”，
iconCls:“图标缩小”，
toggleGroup:'mapTools'，
组：“mapTools”
});
工具栏项。推送（操作）；
action=新地理外部操作({
控件：新建OpenLayers.control.ZoomToMaxExtent（），
地图：地图，
iconCls:“图标最大缩放范围”，
工具提示：“缩放直升机ud”
});
工具栏项。推送（操作）；
地图添加控制（导航）；
map.addLayer（层）；
mapPanel=新建GeoExt.mapPanel({
边界：是的，
id:“地图面板”，
地区：“中心”，
地图：地图，
tbar：工具栏项目
});
主视口=新的外部视口({
布局：“适合”，
营养不良者：没错，
项目：{
布局：“边框”，
延迟呈现：false，
项目：[
地图板
]
}
});
});
我遇到了一个类似的问题，即在iframe中行为古怪

这个问题似乎与元素的揭露有关

在拖放管理器将文档向下移动时禁用Quicktips，然后在鼠标悬停时启用Quicktips。启用时，它会取消元素的伪装，并尝试删除一个类，这似乎是导致它的原因。我真的不知道为什么

无论如何，在unmask（）方法中，尝试修改代码，使其仅在现有掩码已存在时调用removeClass


取消掩码：函数（）{
var me=这个，
dom=me.dom，
掩码=数据（dom，“掩码”），
maskMsg=data（dom，'maskMsg'），
哈斯马斯克


if(mask){
    if(maskMsg){
        maskMsg.remove();
            data(dom, 'maskMsg', undefined);
    }
    mask.remove();
        data(dom, 'mask', undefined);
        hasMask = true;
}
if(hasMask){
        me.removeClass([XMASKED, XMASKEDRELATIVE]);
    }
}

我真的不知道该找什么。没有错误发生，而且我对ExtJS没有太多的经验，不知道它在这个级别应该如何运行。你能给我一个提示吗？这是IE中的问题还是ExtJS不够灵活，无法支持IE和iFrame？换句话说，这是我必须找到解决方法的地方吗在未来的ExtJS版本中进行nd和维护，还是应该从ExtJS中实现？是的，它在SVN中已修复。它与ExtJS无关，只是IE中的一些古怪错误。更新了答案。感谢您的回答。我已经在ext-all-debug.js中插入了您建议的代码，替换了旧代码。现在链接指向my修改了ext-all-debug.js文件，但它仍然不起作用。这不仅仅是您发布的代码吗？问题都在IE7和IE8中。我还没有访问SVN的权限，但只要我的老板说去购买许可证，这应该会改变：）