ExtJS 4.1从外部网页加载内容

我有一个Ext.panel.Panel，我会从外部网页加载内容到我的面板。ExtJS 4.1从外部网页加载内容

我试图用装载机如下所述： loader question

，您可以在此发现的jsfiddle一个例子： http://jsfiddle.net/eternasparta/sH3fK/

Ext.require([  
'Ext.form.*', 
'Ext.tip.*' 
]); 


Ext.onReady(function() {  


Ext.QuickTips.init(); 

Ext.create('Ext.panel.Panel',{ 
renderTo: Ext.getBody(), 
height:400, 
    width:400, 
    id:'specific_panel_id' 
}); 

dynamicPanel = new Ext.Component({ 
     loader: { 
      /*load contents from this url*/ 
      url: 'http://it.wikipedia.org/wiki/Robot', 
      renderer: 'html', 
      autoLoad: true, 
      scripts: true 
      } 
     }); 

Ext.getCmp('specific_panel_id').add(dynamicPanel); 

});

也许我不明白怎么用加载器（如果可能的话）与外部网页。所以我的第一个问题是：是否可以使用加载器将页面http://it.wikipedia.org/wiki/Robot加载到我的面板中？

第二个问题：如果答案是“否”，您如何建议加载该页面的内容？

谢谢大家

来源

2013-08-19 Marco

iFrame呢？ –

对于外部内容，您必须使用iframe。但是如果你想要的是iframe的尺寸由它的容器面板来管理，你必须使它成为一个组件，而不是仅仅使用html属性：

Ext.define('MyIframePanel', { 
    extend: 'Ext.panel.Panel', 
    layout: 'fit', 
    items: [{ 
     xtype: 'box', 
     autoEl: { 
      tag: 'iframe', 
      src: 'http://it.wikipedia.org/wiki/Robot', 
     }, 
    }] 
});

又见一个例子与窗口和动态页面加载中我最近的博客文章：http://nohuhu.org/development/using-render-selectors-to-capture-element-references/。

来源

2013-08-19 21:47:16

我已经独立达成了您提出的解决方案。谢谢你们 – Marco

这是一个安全的原因（访问控制允许来源）。

只需将您的面板的“HTML”属性为：

html: '<iframe src="http://it.wikipedia.org/wiki/Robot"></iframe>',

参见：http://jsfiddle.net/sH3fK/2/

如果从同一个域中加载页面，你可以设置“装载机”的属性您的面板：

来源

2013-08-19 16:00:07 Vlad

但我认为，即使该html文件驻留在您自己的域中，它也不会加载在该html页面中编写的脚本; – Asqan

ExtJS 4.1从外部网页加载内容

回答

相关问题