【问题标题】:Sencha Touch 2: itemtap on IE not targeting divsSencha Touch 2:IE 上的 itemtap 不针对 div
【发布时间】:2015-10-03 00:03:21
【问题描述】:

我正在开发一个 Cordova 混合应用程序,目前在使用 Sencha Touch 2 的 Windows 8.1 上遇到问题。我在一个带有一些子元素的列表项上获得了一些 div。我定义了一个水龙头监听器。这适用于 Android 和 IOS,但不适用于带有 Internet Explorer 的 Win8.1。我总是得到上面的 listitem-element 而不是点击的 div-containers。

这是一个简化的例子:

查看:

Ext.define( 'App.view.MyDataView', {

xtype: 'mydataview',
extend:  Ext.dataview.List ,

config: {

    inline: false,
    title: "myTitle",

    scrollToTopOnRefresh: false,

    cls: 'MyDataView',
    itemCls: 'MyDataViewItem',
    pressedCls: 'MyDataViewItemPressed',
    grouped: true,

    listeners: {
        tap: {
            element: 'element',
            //delegate: '.something',

            fn: function (e)
            {
                console.log(e.target.className)
            }
        }
    },
    deferEmptyText: false,
    infinite: true,

    variableHeights: true,
    itemTpl: new Ext.XTemplate(
        [

                            '<div class="red" style="background-color:red;width:50%">',
                'red',
                '<div class="black" style="background-color:black;width:80%">',
                    '<div class="blue" style="background-color:blue;width:30%">blue</div>',
                'black</div>',
            '</div>'
        ].join( '' ),
        {
            compiled: true,
            getInteractable: function() {},
            //some member functions here...

        }
    )
}
});

e.target on tap listener 总是给我以下信息:

<div class="x-unsized x-list-item WorkingHoursDataViewItem x-has-height x-list-item-tpl" id="ext-simplelistitem-85" style="height: 42px !important; min-height: 42px !important; transform: translate3d(0px, 264px, 0px);">
  <div class="x-unsized x-list-disclosure x-item-hidden" id="ext-component-233" style="display: none !important;"></div>
  <div class="x-innerhtml" id="ext-element-815">
        <div class="red" style="width: 50%; background-color: red;">
              red
           <div class="black" style="width: 80%; background-color:black;">
               <div class="blue" style="width: 30%; background-color:blue;">
                          blue
                          </div>
                     </div>
                    black
                  </div>
             </div>
              </div>
           </div>
        </div>
     </div>
  </div>

我浏览了很多事件,e,target,但没有引用点击的 div 容器:/

提前致谢!

//编辑:简化示例 // 它与 grouped:true 有关 -> 如果我将其注释掉,一切都按预期工作

【问题讨论】:

    标签: javascript cordova internet-explorer sencha-touch windows-8.1


    【解决方案1】:

    已修复 - 如果设置了 grouped: true,则会在 IE 上导致此意外结果。

    解决方法:显示视图后:list.updateGrouped()

    【讨论】:

    • 另一种解决方法 - 使用真正正确支持标准的浏览器。
    • 就像我写的:我正在为 Windows 开发一个 Cordova 混合应用程序,所以没有选择使用不同的 WebView 代替 Microsofts
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-08-21
    相关资源
    最近更新 更多