javascript - 使用 YUI 或 Ext JS 将隐藏的 DIV 变成一个窗口

Question

初学者的问题。我在一个隐藏的 div 中有一些丰富的 HTML，我想把它变成一个 float 的、可拖动的、可关闭的伪窗口、无模式对话框。 YUI 和 ExtJS 可用。

我已经尝试了几个小时，并在网上寻找样本。窗口标题也应该从 DOM 节点获取，但是是纯文本。

    var helpDiv = ... DOM node
    var helpDivExt = Ext.get(helpDiv);
    var contentHTML = '<i>helpDivExt</i>';
    //var contentTitel = '###' + helpDivExt.select('h3');
    var contentTitel = '###' + Ext.query('h3:first', helpDivExt).data;
    var w = new Ext.Window({html: contentHTML, title: contentTitel,
        width: '398px', height: '400px',
        modal: false, closable: true, draggable: true,
        plain: true,
        padding: '5px 10px 10üpx 10px',
        border: '5px solid #7094b7',
        backgroundColor: '#ffffff'
    });
    w.addClass('hilfetext');
    //w.fill(helpDivExt);
    //w.add(helpDivExt);
    w.show();

Answer 1

在 ExtJS Ext.Window 中有一个 contentEl 配置，您可以在其中放置一个现有的 HTML 元素，或者一个现有的 HTML 元素的 id:

例如

new Ext.Window({contentEl: 'the_element_id'});

Further info here