Question

我想将我生成的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不在容器内。它出现在页面底部。我做错了什么？

Answer 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

在extjs中向容器添加iframe

1 个答案: