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從外部網頁加載內容

回答

相關問題