Iframe Ext.getCmp无法隐藏Youtube视频Sencha Touch

我很难在隐藏事件中设置元素（面板）的HTML来删除Sencha Touch 2中的iFrame Youtube视频

隐藏事件正在工作并被调用，因为我在正在调用的隐藏函数中有一个Ext.Msg.alert，它可以工作，但我无法停止隐藏视频

这是我的面板代码：

Ext.define('TCApp.view.MyPanel0', {
extend: 'Ext.Panel',
alias: 'widget.mypanel0',

config: {
    hideOnMaskTap: true,
    scrollable: false,
    items: [
        {
            xtype: 'panel',
            html: '<iframe width="560" height="315" src="http://www.youtube.com/embed/-gv9RicOHNQ" frameborder="0" allowfullscreen></iframe>',
            itemId: 'videopanel',
            hideOnMaskTap: true
        }
    ]
}

等等

这是：

onVideopanelHide: function(component, options) {
    Ext.Msg.alert('Test onhide event');  <-- working hide event called

    Ext.getCmp('videopanel').setHtml("");
    Ext.getCmp('videopanel').setHtml('<div id="video1"><iframe width="560" height="315" src="http://www.youtube.com/embed/NSUucup09Hc?fs=1&amp;hl=en_US&amp;rel=0&autoplay=0" frameborder="0" allowfullscreen></iframe></div><img src="resources/images/thapelo3Fy.jpg" />');

}

onVideopanelHide:功能（组件、选项）{
Ext.Msg.alert（'testonhide event'）；Hey@Digeridoopoo只需对MyPanel0进行一次更改

你的代码

itemId: 'videopanel',

致：

我在控制器上的
onVideopanelHide
方法中编写了这样的代码

Ext.define('myapp.view.MyPanel0', {
   extend: 'Ext.Panel',
   xtype: 'mypanel0',

   config: {
      hideOnMaskTap: true,
      scrollable: false,
      items: [
        {
           xtype: 'panel',
           html: '<iframe width="560" height="315" src="http://www.youtube.com/embed/-gv9RicOHNQ" frameborder="0" allowfullscreen></iframe>',
           id: 'videopanel',
           hideOnMaskTap: true
        }, {html: '<br/>'},
        {
           xtype: 'button',
           text: 'Change Video',
           width: '55%',
           handler: function() {
               Ext.getCmp('videopanel').setHtml('')
               Ext.getCmp('videopanel').setHtml('<div id="video1"><iframe width="560" height="315" src="http://www.youtube.com/embed/NSUucup09Hc?fs=1&amp;hl=en_US&amp;rel=0&autoplay=0" frameborder="0" allowfullscreen></iframe></div><img src="app/images/home.png" />')
           }
        }, {html: '<br/>'},
        {
          xtype: 'button',
          text: 'Video Stop',
          width: '55%',
          handler: function() {
              Ext.getCmp('videopanel').hide()
          }
        }
     ]
  }
});

Ext.define（'myapp.view.MyPanel0'{
扩展：“Ext.Panel”，
xtype:“mypanel0”，
配置：{
hideOnMaskTap：没错，
可滚动：false，
项目：[
{
xtype:'面板'，
html:“”，
id:'视频面板'，
hideOnMaskTap：对
}，{html:'
'}，
{
xtype:'按钮'，
文本：“更改视频”，
宽度：“55%”，
处理程序：函数（）{
Ext.getCmp（'videopanel'）.setHtml（“”）
Ext.getCmp（'videopanel'）.setHtml（“”）
}
}，{html:'
'}，
{
xtype:'按钮'，
文本：“视频停止”，
宽度：“55%”，
处理程序：函数（）{
Ext.getCmp（'videopanel'）.hide（）
}
}
]
}
});

我希望这有帮助。：



Ahhh所以itemid是个问题！Ext getCmp现在对我来说更清晰了。我已经处理了一段时间了，非常感谢+1:-）
id: 'videopanel',

Ext.define('myapp.view.MyPanel0', {
   extend: 'Ext.Panel',
   xtype: 'mypanel0',

   config: {
      hideOnMaskTap: true,
      scrollable: false,
      items: [
        {
           xtype: 'panel',
           html: '<iframe width="560" height="315" src="http://www.youtube.com/embed/-gv9RicOHNQ" frameborder="0" allowfullscreen></iframe>',
           id: 'videopanel',
           hideOnMaskTap: true
        }, {html: '<br/>'},
        {
           xtype: 'button',
           text: 'Change Video',
           width: '55%',
           handler: function() {
               Ext.getCmp('videopanel').setHtml('')
               Ext.getCmp('videopanel').setHtml('<div id="video1"><iframe width="560" height="315" src="http://www.youtube.com/embed/NSUucup09Hc?fs=1&amp;hl=en_US&amp;rel=0&autoplay=0" frameborder="0" allowfullscreen></iframe></div><img src="app/images/home.png" />')
           }
        }, {html: '<br/>'},
        {
          xtype: 'button',
          text: 'Video Stop',
          width: '55%',
          handler: function() {
              Ext.getCmp('videopanel').hide()
          }
        }
     ]
  }
});