javascript 仅 Ext Js IE 错误
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7767463/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Ext Js IE error only
提问by
My web app works fine on Firefox or Chrome but not in IE. It shows me the following message:
我的网络应用程序在 Firefox 或 Chrome 上运行良好，但在 IE 中运行不正常。它向我显示以下消息：
Object doesn't support this property or method
File: ext-all.js - Line: 7 - Char: 6100
对象不支持此属性或方法
文件：ext-all.js - 行：7 - 字符：6100
Any ideas how to fix it?
任何想法如何解决它？
BTW: I'm using ext 3.4.
顺便说一句：我使用的是 ext 3.4。
Edit: All my ext layout creator code:
编辑：我所有的 ext 布局创建者代码：
Ext.onReady(function() {
var viewport = new Ext.Viewport({
layout: 'border',
renderTo: document.body,
items: [{
region: 'north',
height: 25,
xtype: 'toolbar',
items: [{
xtype: 'button',
text: 'Início',
iconCls: 'home',
handler:function() {
var tabs = Ext.getCmp('dynamic-tabs');
tabs.add({
title: 'Início',
closable:true,
iconCls:'home'
}).show();
}
}, {
xtype: 'button',
text: 'Sistema',
iconCls: 'sistema',
menu: {
items: [{
text: 'Usuários',
iconCls: 'usuario',
handler: function(){ },
menu: {
items: [{
text: 'Teste1',
iconCls: 'usuario',
handler: function(){
var tabs = Ext.getCmp('dynamic-tabs');
tabs.add({
title: 'Teste1',
closable:true,
autoLoad: 'iframe.php?url=index.php',
iconCls: 'usuario'
}).show();
}
}, {
text: 'Teste2',
iconCls: 'usuario',
handler: function(){
var tabs = Ext.getCmp('dynamic-tabs');
tabs.add({
title: 'Teste2',
closable:true,
autoLoad: 'iframe.php?url=index.php',
iconCls: 'usuario'
}).show();
}
}]
}
}, {
text: 'Configura??es',
iconCls: 'sistema',
handler: function(){
var tabs = Ext.getCmp('dynamic-tabs');
tabs.add({
title: 'Configura??es',
closable:true,
autoLoad: 'iframe.php?url=form.php',
iconCls: 'sistema'
}).show();
}
}, {
text: 'Relatório Vertical',
iconCls: 'relatorio',
handler: function(){
var tabs = Ext.getCmp('dynamic-tabs');
tabs.add({
title: 'Relatório Vertical',
closable:true,
autoLoad: 'iframe.php?url=relatorio_v.php',
iconCls: 'relatorio'
}).show();
}
}, {
text: 'Relatório Horizontal',
iconCls: 'relatorio',
handler: function(){
var tabs = Ext.getCmp('dynamic-tabs');
tabs.add({
title: 'Relatório Horizontal',
closable:true,
autoLoad: 'iframe.php?url=relatorio_h.php',
iconCls: 'relatorio'
}).show();
}
},
'-', {
text: 'Sair',
iconCls: 'logoff',
handler: function(){
location.reload()
}
}]
}
}, {
xtype: 'button',
text: 'Abas',
iconCls: 'abas',
menu: {
items: [{
text: 'Criar nova Aba',
iconCls: 'tab_add',
handler: function(){
var tabs = Ext.getCmp('dynamic-tabs');
tabs.add({
title: 'Nova Aba',
html: 'Tab Body',
closable:true,
iconCls: 'tab_add'
}).show()
}
}, {
text: 'Ir para a primeira Aba',
iconCls: 'tab_go',
handler: function(){
tabs.setActiveTab(0);
}
}, {
text: 'Excluir 2a Aba',
iconCls: 'tab_delete',
handler: function(){
var tabs = Ext.getCmp('dynamic-tabs');
if (tabs.get(1)) {
var tab = tabs.get(1);
tabs.remove(tab);
}
}
}]
}
}, {
xtype: 'button',
text: 'Menus',
iconCls: 'usuario',
menu: {
items: [{
text: 'Sub-menus com título dif.',
iconCls: 'usuario',
handler: function(){ },
menu: {
items: ['Título do Sub-menu',
{
text: 'Sub-menu #1',
iconCls: 'usuario',
handler: function(){
var tabs = Ext.getCmp('dynamic-tabs');
tabs.add({
title: 'Sub-menu #1',
closable:true,
autoLoad: 'iframe.php?url=phpinfo.php',
iconCls: 'usuario'
}).show();
}
}, {
text: 'Sub-menu #2',
iconCls: 'usuario',
handler: function(){
var tabs = Ext.getCmp('dynamic-tabs');
tabs.add({
title: 'Sub-menu #2',
closable:true,
autoLoad: 'iframe.php?url=phpinfo.php',
iconCls: 'usuario'
}).show();
}
}]
}
}, {
text: 'Sub-menus com título igual',
iconCls: 'usuario',
handler: function(){ },
menu: {
items: ['Sub-menus com título igual',
{
text: 'Sub-menu #1',
iconCls: 'usuario',
handler: function(){
var tabs = Ext.getCmp('dynamic-tabs');
tabs.add({
title: 'Sub-menu #1',
closable:true,
autoLoad: 'iframe.php?url=phpinfo.php',
iconCls: 'usuario'
}).show();
}
}, {
text: 'Sub-menu #2',
iconCls: 'usuario',
handler: function(){
var tabs = Ext.getCmp('dynamic-tabs');
tabs.add({
title: 'Sub-menu #2',
closable:true,
autoLoad: 'iframe.php?url=phpinfo.php',
iconCls: 'usuario'
}).show();
}
}]
}
}, {
text: 'Sub-menus sem título',
iconCls: 'usuario',
handler: function(){ },
menu: {
items: [{
text: 'Sub-menu #1',
iconCls: 'usuario',
handler: function(){
var tabs = Ext.getCmp('dynamic-tabs');
tabs.add({
title: 'Sub-menu #1',
closable:true,
autoLoad: 'iframe.php?url=phpinfo.php',
iconCls: 'usuario'
}).show();
}
}, {
text: 'Sub-menu #2',
iconCls: 'usuario',
handler: function(){
var tabs = Ext.getCmp('dynamic-tabs');
tabs.add({
title: 'Sub-menu #2',
closable:true,
autoLoad: 'iframe.php?url=phpinfo.php',
iconCls: 'usuario'
}).show();
}
}]
}
}, {
text: 'Sub-menu grande',
iconCls: 'usuario',
handler: function(){ },
menu: {
items: [{
text: 'Nível #1',
iconCls: 'usuario',
handler: function(){ },
menu: {
items: [{
text: 'Nível #2',
iconCls: 'usuario',
handler: function(){ },
menu: {
items: [{
text: 'Nível #3',
iconCls: 'usuario',
handler: function(){ },
menu: {
items: [{
text: 'Nível #4 e etc...',
iconCls: 'usuario',
handler: function(){ }
}]
}
}]
}
}]
}
}]
}
}]
}
}]
} , {
region: 'center',
xtype: 'tabpanel',
id: 'dynamic-tabs',
items: [{
title: 'Início',
autoLoad: 'iframe.php?url=phpinfo.php',
iconCls:'home'
}]
} , {
region: 'south',
xtype: 'toolbar',
id: 'barra',
height: 25,
items: [{
xtype: 'tbtext',
text: 'Pacific Tecnologia da Informa??o ? 2011',
html: '<img src=\'imagens/logo_peq.png\' />'
}]
}]
});
var tabs = Ext.getCmp('dynamic-tabs'); tabs.setActiveTab(0); });
It's a simple sample menu. I tested in IE version 8 and emulating 7 with compatibility mode.
这是一个简单的示例菜单。我在 IE 版本 8 中进行了测试，并使用兼容模式模拟了 7。
Interesting observation: In Firefox firebug's console shows:
有趣的观察：在 Firefox firebug 的控制台中显示：
<html xmlns="http://www.w3.org/1999/xhtml" class=" x-viewport">
<head></head>
<body id="ext-gen5" class=" ext-gecko ext-gecko3 x-border-layout-ct">
etc...
IE's Developers Tools shows:
IE 的开发者工具显示：
<html class=" x-quirks ext-border-box x-viewport">
<head>
<title></title>
<body class=" ext-ie ext-ie7 x-border-layout-ct" id="ext-gen5" scroll="no">
Texto -
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
Texto - Nó de Texto Vazio
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<script language="javascript" src="js/ext/adapter/ext/ext-base.js" type="text/javascript"></script>
etc...
My HTML file:
我的 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" src="js/ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" language="javascript" src="js/ext/ext-all-debug.js"></script>
<script type="text/javascript" language="javascript" src="js/menu.js.php"></script>
<script type="text/javascript" language="javascript" src="js/layout.js.php"></script>
<link rel="stylesheet" type="text/css" href="js/ext/resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="js/ext/resources/css/xtheme-blue.css" />
<link rel="stylesheet" type="text/css" href="css/menu.css" />
<link rel="stylesheet" type="text/css" href="css/layout.css" />
<link rel="stylesheet" type="text/css" href="css/icones.css.php" /></head>
<body>
</body>
</html>
采纳答案by sra
I had this error previously. In my case I had an entity called locationand ext created a object from it. Now the IE used the JS native location object and tried to execute methods on it. The error looked much the same as your error.
我以前有这个错误。在我的例子中，我有一个名为locationext的实体，并从中创建了一个对象。现在 IE 使用 JS 本机位置对象并尝试在其上执行方法。该错误看起来与您的错误非常相似。
Use the IE developer toolbar and debug your code to identify the exact object. That's how I solved this issue!
使用 IE 开发人员工具栏并调试您的代码以识别确切的对象。我就是这样解决这个问题的！
EDIT based on the new Demo code:
基于新的演示代码进行编辑：
Your HTML file should start with
你的 HTML 文件应该以
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
I never had any problems with these settings. The debugger may look different, cause ExtJS will add classes at runtime, but this should be your source HTML file.
这些设置我从来没有遇到过任何问题。调试器可能看起来不同，因为 ExtJS 会在运行时添加类，但这应该是您的源 HTML 文件。
回答by Chao
can you include ext-all-debug.js instead of ext-all.js? And then tell us which line is throwing the error? Some possible solutions http://www.sencha.com/forum/showthread.php?81087-OPEN-418-3.0.0-el.ownerDocument.createRange()-error-in-IE8
你可以包含 ext-all-debug.js 而不是 ext-all.js 吗？然后告诉我们哪一行抛出错误？一些可能的解决方案 http://www.sencha.com/forum/showthread.php?81087-OPEN-418-3.0.0-el.ownerDocument.createRange()-error-in-IE8
回答by Mark Porter
Here is how I troubleshoot this in Ext/IE:
以下是我在 Ext/IE 中解决此问题的方法：
Check for dangling commas. Older versions of IE hate a comma before a } or ]. Ext's coding style makes this mistake likely. I use this (jEdit) regex to search: ",(\s*\n*\s*[}|]])"
Use alerts to identify the line of your code that leads to the error. You will probably be passing an object to an Ext function. This object is likely null/undefined or not of the type expected. An alert(typeof somevar) might be helpful here. If there is no obvious entry point, look to your "xtype" definitions and listeners: one of these might be invalid
Watch out of global poisoning. I ran into a problem recently where I had a global JS variable with the same name as a DIV's id property. IE tries to make a global variable out of every DOM id,and I was picking up the wrong one. If this is affecting you it is probably because a local function variable is missing the "var" keyword and thus conflicting with he global space.
检查悬空的逗号。旧版本的 IE 讨厌在 } 或 ] 之前使用逗号。Ext 的编码风格很可能导致这个错误。我使用这个 (jEdit) 正则表达式来搜索：",(\s*\n*\s*[}|]])"
使用警报来识别导致错误的代码行。您可能会将一个对象传递给 Ext 函数。此对象可能为空/未定义或不是预期的类型。警报（typeof somevar）在这里可能会有所帮助。如果没有明显的入口点，请查看您的“xtype”定义和侦听器：其中之一可能无效
小心全球中毒。我最近遇到了一个问题，我有一个与 DIV 的 id 属性同名的全局 JS 变量。IE 试图从每个 DOM id 中创建一个全局变量，但我选择了错误的变量。如果这对您有影响，那可能是因为局部函数变量缺少“var”关键字，从而与全局空间发生冲突。
回答by Frederik.L
Seems like you try to call a property or method that IE is the only one that can't understand. Are you using some natives objects that could be known by everyone except IE ?
似乎您尝试调用 IE 唯一无法理解的属性或方法。您是否使用了一些除了 IE 之外所有人都知道的本地对象？
回答by Ionel Cucu
You call a method or a property on an object that doesn't support it. Try to find what kind of object is that one and add the method to it.
您在不支持它的对象上调用方法或属性。尝试找出那个对象是什么类型的对象并将方法添加到其中。
Can you provide some code please?
你能提供一些代码吗？
回答by Khan
You sir have probably encountered the dreaded "owner.createDocument.createRange IE Bug"
您先生可能遇到了可怕的“owner.createDocument.createRange IE Bug”
Some solutions point to the fact that the first node is not valid.
一些解决方案指出第一个节点无效。
Here are two possible solutions :
以下是两种可能的解决方案：
ext js - el.ownerDocument.createRange() errors in IE 8
ext js - IE 8 中的 el.ownerDocument.createRange() 错误
Good luck
祝你好运
回答by VoteMeUp
It's an IE Bug, may it fixed on version 4.
这是一个 IE 错误，可能会在版本 4 上修复。
