Sencha 触控面板 html 不可见

Posted 2023-02-25

【中文标题】Sencha 触控面板 html 不可见

【英文标题】：Sencha Touch panel html not visible

【发布时间】：2014-03-05 02:29:18

【问题描述】：

我在模拟器上运行我的 sencha-touch/phonegap 应用程序，当我在面板上使用 iframe 设置 html 时。它不可见。但是，如果我切换到不同的面板并返回到原始的 html 面板。 html是可见的。 我相信这是刷新或布局问题，但我找不到重绘面板的方法。

我已经尝试过myPanel.hide() 和myPanel.show() 但内容不可见。我在下面的 div 中有 iframe

'<div style="height:100%;-webkit-overflow-scrolling:touch;"><iframe style="width:100%;height:100%" src="'+results[i].url+'"/></div>'

我正在动态设置 div 的内容，如下所示。

for(var i=0;i<results.length;i++)
                    
                        console.log("Setting the result page to "+results[i].url);
                        var url = '<div style="height:100%;-webkit-overflow-scrolling:touch;"><iframe style="width:100%;height:100%" src="'+results[i].url+'"/></div>';

                        this.getResultsTabPanel().add( 
                            title: results[i].title,
                            id:results[i].title+(i+1),
                            itemId:results[i].title+(i+1),                              
                            html:url              
                        );
                           

有什么想法吗？

【问题讨论】：

你能再分享一些代码吗

我更新了更多代码。

【参考方案1】：

我现在有一个解决方案。而不是立即将子面板添加到选项卡面板。我像这样在里面创建它们

    for(var i=0;i<results.length;i++)
                    

                        var url = '<div style="height:100%;-webkit-overflow-scrolling:touch;"><iframe style="width:100%;height:100%" src="'+results[i].url+'"/></div>';                         
                        var result =   
                                    title: results[i].title,
                                    id:results[i].title+(i+1),
                                    config :  
                                        itemId:results[i].title+(i+1),   
                                    ,
                                    xtype: 'panel',
                                    scrollable:true,
                                    styleHtmlContent : true,                                
                                    html:url                                                
                                ;
                        panels.push(result);
                       
                    this.getResultsTabPanel().add(panels);

这适用于 chrome 浏览器和模拟器。