1

我在小提琴中创建了这个来展示我在 nw.js 中尝试做的事情。这工作得很好。在运行时动态创建 2 个选项卡就好了。

http://jsfiddle.net/fnbqupf4/

我将它移植到我的 nw.js 中,当调用 ace.edit() 说它找不到元素 ID 时出现错误。当我查看 nw.js 中的 DOM 时,我看到了选项卡,并且没有在那里创建编辑器。所以问题是标签和编辑器 div 是在 jsFiddle 但不是在 nw.js 站点中创建的。

是否有无法在 nw.js 中向 DOM 动态添加元素的问题?

$.fn.addEditorTab = function(name, tabName, contents) {
            console.log("1");
            $('ul', this).append('<li title="' + name + '"><a href="#tab-' + name + '">' + tabName + '</a><span class="ui-icon ui-icon-close" role="presentation"></li>');
            $(this).append("<div id='tab-" + name + "'><div id='editor-" + name + "' class='editor'></div></div>");
            $(this).tabs("refresh");
            console.log("2");

            var editor = ace.edit("editor-" + name);
            console.log("3");
            editor.setTheme("ace/theme/monokai");
            editor.getSession().setMode("ace/mode/lua");
            editor.setOptions({
                maxLines: Infinity
            });
            editor.getSession().setValue(contents);

            return editor;
        };

[编辑] 经过一番混乱之后,似乎只有当我在 w2ui 的面板中有标签 div 时才有问题。

$('#layout').w2layout({
                name: 'layout',
                panels: [
                    { type: 'top', size: 50, style: pstyle, content: 'top', resizable: true },
                    { type: 'left', size: 300, style: pstyle, content: '<div id="sidebar" style="height: 100%; width: 100%;"></div>', resizable: true }
                    //{ type: 'main', style: pstyle, content: '<div id="editor"></div>' }
                    { type: 'main', style: pstyle, content: '<div id="tabs"><ul></ul></div>' }
                ]
            });
4

0 回答 0