在给定的代码中,可以在点击图片时打开一个新的空白页面,并在新页面中展示图片。以下是实现这个功能的代码:

_getImageShowPanel: function (images, title) {
    return {
        title: title,
        xtype: "fieldset",
        border: 0,
        height: 130,
        anchor: '100%',
        items: [{
            height: 130,
            autoScroll: true,
            showSize: false,
            showCloseBtn: false,
            style: 'margin:2;',
            xtype: "ux-image-panel",
            anchor: '90%',
            listeners: {
                afterrender: function (imagePanels) {
                    Ext.each(images, function (item) {
                        imagePanels.addImage(item);
                    });
                    imagePanels.on('click', function (imagePanel, image) {
                        // 在这里执行跳转到空白页展示图片的逻辑
                        // 打开新的空白页面
                        var newWindow = window.open('', '_blank');
                        // 在新页面中添加图片元素
                        var img = newWindow.document.createElement('img');
                        img.src = image.url;
                        newWindow.document.body.appendChild(img);
                    });
                }
            }
        }]
    }
}

在函数_getImageShowPanellistenersafterrender事件中,添加了点击事件的处理函数。在点击事件处理函数中,首先使用window.open打开一个新的空白页面,并获取到新页面的document对象。然后,创建一个img元素,并将图片的URL赋值给src属性,最后将img元素添加到新页面的body中。这样就实现了在新页面中展示图片的功能。

ExtJS 图片添加点击跳转到空白页展示功能

原文地址: https://www.cveoy.top/t/topic/b1qp 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录