将extjs与jquery结合的问题

Issue with combining extjs with jquery

本文关键字:问题 结合 jquery extjs      更新时间:2023-09-26

我尝试将jquery与extjs一起使用。当我点击一个图像时,我希望获得该图像的id并将其存储在一个变量中。这部分我使用jquery。该图像位于extjs面板中。我使用没有结果和后渲染侦听器以下是我的代码:

items: [{
                xtype: 'tabpanel',
                width: 600,
                activeTab: 0,
                flex: 2,
                layout: {type: 'fit'},
                items: [{
                        xtype: 'panel',
                        title: 'Images',
                        items: [{contentEl:'img',autoScroll:true,height:500 }],

                        listeners: {afterrender: function(c){c.el.on('click', function() 
                        { 
                         $('img').on( 'click',function() { // event delegation
                            var idImg = $(this).attr('id');
                            alert(idImg);
                            addMarker(idImg)
                            var alt = $(this).attr('alt'); // get the value of alt
                            $('#curInterId').val(alt); // place the internal id in the text box 
                                    });

                         });}},
                        },{ 
                        xtype: 'panel',
                        title: 'Material',
                        items: [{contentEl:'msg',autoScroll:true,height:500 }]
                        }]
            }],renderTo : Ext.getBody()
        },

试试这样的东西:

Fiddle Link

Ext.application({
    name: 'Fiddle',
    launch: function() {
        Ext.create("Ext.panel.Panel", {
            layout: "fit",
            renderTo: Ext.getBody(),
            items: [{
                xtype: 'panel',
                title: 'Images',
                items: [{
                    xtype: 'image',
                    height: 200,
                    width: 600,
                    src: 'http://www.newbridgegreen.com/assets/bootstrap/img/sencha_logo.png',
                    listeners: {
                        el: {
                            click: function() {
                                Ext.Msg.alert("Message");
                            }
                        }
                    }
                }]
            }]
        });
    }
});

这里的关键是el:在侦听器中,可以使用此方法向任何元素添加标准DOM单击处理程序。