如何为HTML对象插入处理程序?

时间:2011-05-13 17:47:35

标签: javascript sencha-touch extjs

问题很简单!

我有一个这样的对象:

new Ext.Panel({

        id: 'Panel',
        fullscreen: true,
        dockedItems: [
                  dock:...,
                  width: ...,
                  listeners: { el: /*TOUCHEVENTS*/ },
                  html: '<object id='objectID' data="blabla"/>'
        ]

    });

如何在id = ObjectID ???的HTML对象上添加事件(如点击或捏合)

提前致谢;)

2 个答案:

答案 0 :(得分:2)

我建议您使用事件委派来满足您的要求。 事件委派允许您在面板内部HTML对象上的特定目标上设置点击侦听器。我给你写了一个例子,告诉你如何做到这一点:

Ext.setup({
onReady: function() {

    //Definition of a handler function
    var myHandler = function(){
        Ext.Msg.alert('What???','Did you Tap me?');
    };

    //Definition of a simple Panel
    var p = new Ext.Panel({
        fullscreen: true,
        dockedItems: [{
            xtype: 'panel',
            dock: 'top',
            height: '30',
            html: '<div id="myObject">Tap me please</div>',
            listeners: {
                body: {
                    tap: myHandler,
                    delegate: '#myObject'     
                 }
            }
        }]
    });

}
});

如果您运行此代码,当您点击“请点击我!”时,您会看到该代码。 div,你的事件将被解雇。

希望这有帮助。

答案 1 :(得分:1)

类似的东西:

var p = new Ext.Panel({
    id: 'Panel',
    fullscreen: true,
    dockedItems: [
        html: '<object id='objectID' data="blabla"/>'
    ]
});
p.on('render', function() {
    Ext.get("objectID").on('click', function() {
        alert('imclicket');
    });    
});