Javascript aloha界面未正确显示（屏幕截图）_Javascript_Aloha Editor

Javascript aloha界面未正确显示（屏幕截图）

javascript

Javascript aloha界面未正确显示（屏幕截图）,javascript,aloha-editor,Javascript,Aloha Editor,我已经按照aloha-editor.org中的说明“安装”了aloha编辑器 Aloha编辑器已加载（如图所示），但未正确加载您可以在此处看到foto：这是我使用的一些javascript： <head> <script type="text/javascript" src="lib/js/jquery-1.7.1.min.js"></script> <script src="aloha/lib/aloha.js"

我已经按照aloha-editor.org中的说明“安装”了aloha编辑器

Aloha编辑器已加载（如图所示），但未正确加载

您可以在此处看到foto：

这是我使用的一些javascript：

<head>
<script type="text/javascript" src="lib/js/jquery-1.7.1.min.js"></script>
     <script
        src="aloha/lib/aloha.js"
        data-aloha-plugins="common/format,common/list" >
    </script>
<script type="text/javascript">
Aloha.ready( function() {
        Aloha.jQuery('#content').aloha();
});
</script>
</head>


Aloha.ready（函数（）{
jQuery（“#content”）.Aloha（）；
});

我遇到了类似的问题-只需下载他们引用的css文件并在本地运行即可。使用他们的代码运行它可能会有问题。如果您已经这样做了，那么请仔细检查css文件的路径

<link href="aloha.css" rel="stylesheet" type="text/css"> (local seems to help)

（本地似乎有帮助）

其他包括和配置

<script src="http://cdn.aloha-editor.org/current/lib/aloha.js"
        data-aloha-plugins="common/format,
                            common/list,
                            common/link,
                            common/highlighteditables">
</script>

…并在第页启动

<script type="text/javascript">
        Aloha.ready( function() {
              var $ = Aloha.jQuery;
              $('.editable').aloha();
        });
</script>


Aloha.ready（函数（）{
var$=Aloha.jQuery；
$（'.editable'）.aloha（）；
});

最后-具有class='editable'的所有元素都是可编辑的

<p class="editable">Click to edit this paragraph.</p>

单击以编辑此段落

我在想aloha编辑器可能有一些z-index问题……或者他们正在处理一些bug……这里是一个寻找答案的好地方

如果不工作，考虑CKddor或类似？值得一试，这是我最常使用的

有完全相同的问题，即使在添加css引用之后。最后转到他们的演示页面，复制他们的源代码来初始化aloha以使其工作

<link href="/Scripts/aloha/css/aloha.css" type="text/css" rel="stylesheet" />
<script>
    var Aloha = window.Aloha || (window.Aloha = {});

    Aloha.settings = {
        locale: 'en',
        plugins: {
            format: {
                config: ['b', 'i', 'p', 'sub', 'sup', 'del', 'title', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'pre', 'removeFormat'],
                editables: {
                    // no formatting allowed for title
                    '#title': []
                }
            },
            link: {
                editables: {
                    // No links in the title.
                    '#title': []
                }
            },
            list: {
                editables: {
                    // No lists in the title.
                    '#title': []
                }
            },
            image: {
                'fixedAspectRatio': true,
                'maxWidth': 1024,
                'minWidth': 10,
                'maxHeight': 786,
                'minHeight': 10,
                'globalselector': '.global',
                'ui': {
                    'oneTab': false
                },
                editables: {
                    // No images in the title.
                    '#title': []
                }
            }
        },
        sidebar: {
            disabled: true
        }
    };
</script>

<script type="text/javascript" src="/Scripts/aloha/lib/aloha.js"
            data-aloha-plugins="common/format,
                                common/table,
                                common/list,
                                common/link,
                                common/highlighteditables,
                                common/block,
                                common/undo,
                                common/contenthandler,
                                common/paste,
                                common/commands,
                                common/abbr,
                                extra/browser,
                                extra/linkbrowser"></script>

<!-- turn an element into editable Aloha continuous text -->
<script type="text/javascript">
    Aloha.ready(function () {
        Aloha.require(['aloha', 'aloha/jquery'], function (Aloha, $) {
            $('.edit').aloha();
        });
    });

</script>


var Aloha=window.Aloha | |（window.Aloha={}）；
Aloha.settings={
地区：'en'，
插件：{
格式：{
配置：['b'，'i'，'p'，'sub'，'sup'，'del'，'title'，'h1'，'h2'，'h3'，'h4'，'h5'，'h6'，'pre'，'removeFormat']，
可编辑内容：{
//标题不允许使用格式
#标题:[]
}
},
链接：{
可编辑内容：{
//标题中没有链接。
#标题:[]
}
},
名单：{
可编辑内容：{
//标题中没有列表。
#标题:[]
}
},
图片：{
“FixedSpectratio”：正确，
“maxWidth”：1024，
“最小宽度”：10，
“最大高度”：786，
“最小高度”：10，
“globalselector”：“.global”，
“用户界面”：{
“oneTab”：错误
},
可编辑内容：{
//标题中没有图像。
#标题:[]
}
}
},
侧栏：{
残疾人士：对
}
};
Aloha.ready（函数（）{
require（['Aloha'，'Aloha/jquery']，函数（Aloha，$）{
$（'.edit'）.aloha（）；
});
});

另一方面，尽管“就地编辑”功能非常出色，但最终还是没有使用该编辑器。主要原因是库相当大，甚至缩小了，超过1MB，并且在测试过程中发现了一些奇怪的行为（很可能是因为项目仍处于开发的早期阶段）。我测试的版本是0.20.10。

有趣的是，三个月前发布的帖子没有任何答案，30分钟内我们两个都发布了一个。耶，奇怪……我没有在大项目上使用Aloha。可能不会有一段时间，因为他们似乎正在经历很多错误修复等。不是超级稳定的，嗯？