sencha touch中点击overlay，会触发底下的输入框获得焦点的处理办法

sencha touch中，弹出一个overlay，或者一个Ext.Msg，如果这个overlay下面正好是一个输入框或者按钮，当点击overlay中按钮时，会发生穿透，使下面的按钮或输入框触发事件。

大概是这样一种现象：

这是一组图片，点击图片，弹出一个overlay层，

这是点击之后，放大的情况。此时我们点击close按钮，会关闭overlay层。但是，很不巧的是，如果你点击的是图中圆圈区域，那么这个点击会发生穿透，使下面的小图片也触发点击事件，即还会再次弹出被穿透的那个图片。

解决办法1：

所有的container和component都一个disabled方法，可以监控，当overlay弹出时，使下边的层disable，当overlay消失时，取消disable。

解决办法2：

给下面的层组件添加一个css属性：pointer-events：none，来组织它的焦点事件。

当弹出overlay时，就给下面的组件添加一个css属性，当overlay消失时，取消这个属性。大概代码为：

Ext.Viewport.on({
  delegate: 'mask',
  show: function(mask) {
    var activeItem = Ext.Viewport.getActiveItem();
    if (activeItem.element)
      activeItem.element.addCls('prevent-pointer-events');
  },
  hide: function(mask) {
    var activeItem = Ext.Viewport.getActiveItem();
    setTimeout(function() {
      if (activeItem.element)
        activeItem.element.removeCls('prevent-pointer-events');
    }, 400);
  }
});