在 extjs 中向容器添加 iframe

Posted 2023-02-26

【中文标题】在 extjs 中向容器添加 iframe

【英文标题】：add an iframe to container in extjs

【发布时间】：2016-08-14 16:29:21

【问题描述】：

我想将我的 javascript 生成的 iframe 添加到面板中。这是 extjs 4.x 版本，我是 extjs 的新手 这是我获取面板和容器的代码

function generatePanel() 
....
....
    var thecontainer = Ext.create('Ext.form.FieldSet', 
            title: "my container",
            labelWidth: 1,
            bodyStyle: "padding-right:5px;padding-left:5px;",
            layout: 'anchor', 

        );

var ifrm = document.createElement("iframe");
    ifrm.setAttribute("src", "http://google.com/");
    ifrm.setAttribute("name", "myIframe");
    ifrm.style.width = "640px";
    ifrm.style.height = "480px";
    document.body.appendChild(ifrm);

....

这工作正常，但 iframe 不在容器内。它显示在页面底部。我做错了什么？

【参考方案1】：

您可以将 iframe 创建为容器的一个项目，例如：

var thecontainer = Ext.create('Ext.form.FieldSet', 
        title: "my container",
        labelWidth: 1,
        bodyStyle: "padding-right:5px;padding-left:5px;",
        layout: 'anchor', 
        items: [
            xtype: 'box',
            autoEl: 
                tag: 'iframe',
                src: '//example.com',
                width: 640,
                height: 480
            
          
        ]
    );

或者：

thecontainer.add(
        xtype: 'box',
        autoEl: 
            tag: 'iframe',
            src: '//example.com',
            width: 640,
            height: 480
        
      );

工作示例：https://fiddle.sencha.com/#fiddle/1f83

【讨论】：

我知道，但这会增加正文...我需要将它放在容器“theContainer”中

谢谢，这可行，但它不会留在我的主容器中，它会将“theContainer”放到页面底部

我对 extjs 太陌生了。你可能会看到我的更多问题：D

如果你想看看还有一个***.com/questions/38945204/…