0

我使用 sencha touch 2 创建了列表。

var aroundList = Ext.create('Ext.List', {
    itemCls : 'my-dataview-item',
    id : 'aroundMeList',
    itemTpl : '<div><img style="padding:1px; border-style:solid; border-width:1px; border-color:{trustColor}" src="' + localStorage.httpServerPrefix + '{imageURI}"/><span id="name">{fullname}</span><span id="time">{time}</span><p id="msg">{text}<span id="count">&nbsp;{replyCount}&nbsp;</span></p><p id="dist">&nbsp;< '+localStorage.radius+''+localStorage.unit+' '+'&nbsp;</p></div>',
    store : aroundStore,
    listeners : {
        select : {
            fn : this.onMessageClickedInAround,
            scope : this
        }
    }
});

我得到这样的输出(不完全是,但是,像这样)

在此处输入图像描述

当用户单击列表中的第一行或第一项时,我正在调用 onMessageClickedInAround 方法(此方法用于显示来自该用户的消息),您可以看到上面的代码。

现在我有一个要求,当用户单击列表中的任何图片时,我需要显示相应的个人资料页面(即一个用户可以通过单击列表中的图像查看其他人的个人资料),有什么办法可以做这 ?

4

2 回答 2

4

您应该为此使用事件委托

更新

var aroundList = Ext.create('Ext.List', {
    // rest of your cfg
    listeners : {
        // other listeners
        tap: {
            fn: yourHandler,
            element: 'element',
            delegate: 'img'
        }
    }
});

如前所述,以下内容已过时

var aroundList = Ext.create('Ext.List', {
    // rest of your cfg
    listeners : {
        // other listeners
        el: {
            tap: yourHandler,
            delegate: 'img'
        }
    }
});
于 2013-02-08T08:54:06.657 回答
2

如果您的列表由数据源填充,则 sencha touch 会将相应的记录传递给您的 itemTap 侦听器。您可以按照以下方式执行此操作。

    listeners : {
        itemtap: function (list, index, item, record) {
            // Show next view based on current record
        }
    }

如果您只想在图像点击上执行此操作,则可以检查该侦听器中的事件。

    listeners : {
        itemtap: function (list, index, item, record, senchaEvent) {
            if (senchaEvent.event.target.nodeName === 'img') {
                // Show next view
            }
        }
    }

您也可以上课<img>并检查。

于 2013-02-08T09:17:20.163 回答