在选项卡面板中访问iframe extjs4.2 [英] Accessing an iframe inside a tab panel extjs4.2

问题描述

我有一个标签面板由两个选项卡组成。我正在尝试通过使用window.frames [id]访问每个选项卡中的iframe，但是在警报时我将无法定义。如何在我的情况下访问iframe？

  tabPanel = Ext.create（'Ext.tab.Panel'，{
 region：'center'，
 activeTab：0，
 autoScroll：true，
 items：[
 {
 id：panel_A，
标题：$ {tr.A}，
 html：< iframe src ='+ A_url +'width ='100％'height ='100％'id ='frm_A'name =' frm_A'frameborder = 0 />，
}，{
 id：panel_B，
标题：$ {tr.B}，
 // disabled： tab_status，
 // hidden：hidden，
 html：< iframe src ='+ B_url +'width ='100％'height ='100％'id ='frm_B'name = 'frm_B'frameborder = 0 />，
}] 
}）; 
 
 
 viewport = new Ext.Viewport（{
 layout：'border'，
 items：[tabPanel] 
}）; 
  

解决方案

要选择DOM元素，您可以使用 Ext.dom.Query.select（），别名 Ext.query（）。

Ext.dom.Query通过将查询编译为可重用功能，提供高性能选择器/ xpath处理。可以插入新的伪类和匹配器。它适用于HTML和XML文档（如果传入了内容节点）。

更多关于使用ExtJS在这个答案。

尝试像 Ext .query（'iframe＃frm_A'）;

工作小提琴

I have a tab panel formed of two tabs. I'm trying to access the iframe in each tab by using "window.frames["id"]" but i'm getting undefined when alerting it. How to access the iframe in my case?

 tabPanel = Ext.create('Ext.tab.Panel', {
            region: 'center',
            activeTab: 0,
            autoScroll: true,
            items: [
                    {   
                        id:"panel_A",
                        title: "${tr.A}",
                        html: "<iframe src= '"+A_url +"' width='100%' height='100%' id='frm_A' name='frm_A' frameborder=0 />",
                    },{
                        id:"panel_B",
                        title: "${tr.B}",
                        //disabled:tabs_status,
                        //hidden:hidden,
                        html: "<iframe src='"+B_url +"'  width='100%' height='100%' id='frm_B' name='frm_B' frameborder=0 />",
                    }]
            });


        viewport = new Ext.Viewport({
            layout:'border',
            items:[tabPanel]
        });

解决方案

To select DOM elements you can use Ext.dom.Query.select(), alias Ext.query().

Ext.dom.Query Provides high performance selector/xpath processing by compiling queries into reusable functions. New pseudo classes and matchers can be plugged. It works on HTML and XML documents (if a content node is passed in).

More about navigating through DOM with ExtJS in this answer.

Try something like Ext.query('iframe#frm_A');

Working fiddle

这篇关于在选项卡面板中访问iframe extjs4.2的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！