jquery - 如何重新排序所见即所得编辑器的控件

Question

我正在使用 https://github.com/akzhan/jwysiwyg这是显示

B I U 

作为控件，我想更改控件的顺序，因此 bold 不会作为选项首先显示。

我查看了源代码并在 https://github.com/akzhan/jwysiwyg/blob/master/jquery.wysiwyg.css 中, 看见了

div.wysiwyg ul.toolbar li.bold { background-position: -1px -15px; }
div.wysiwyg ul.toolbar li.italic { background-position: -18px -15px; }

所以我改成了

div.wysiwyg ul.toolbar li.bold { background-position: -18px -15px; }
div.wysiwyg ul.toolbar li.italic { background-position: -1px -15px; }

现在在编辑器中，I 在 B 之前，但是当我单击 I 时，它仍然是粗体，当我单击 B 时，它仍然是斜体。如何解决这个问题？还有就是不编辑主 jquery.wysiwyg.css 文件而只覆盖 .css 和 .js 代码吗？我正在使用 RubyonRails 顺便说一下

谢谢

Answer 1

需要在wysiwyg.js

源码中修改粗体和斜体属性的顺序

我只是改变了下面代码的位置

bold: {
            groupIndex: 0,
            visible: true,
            tags: ["b", "strong"],
            css: {
                fontWeight: "bold"
            },
            tooltip: "Bold",
            hotkey: {"ctrl": 1, "key": 66}
        },

和

italic: {
            groupIndex: 0,
            visible: true,
            tags: ["i", "em"],
            css: {
                fontStyle: "italic"
            },
            tooltip: "Italic",
            hotkey: {"ctrl": 1, "key": 73}
        },

然而，我没有更改任何 css，但它仍然工作正常。默认情况下，bold: 属性是 wysiwyg.js 文件中的 this.controls 对象传递的第一个属性，不知道为什么即使不修改 css 文件，仍然可以正常工作。

编辑:

演示:http://jsfiddle.net/M2uKK/2/

我在 fiddle 本身中添加了所需的所有 js 和 css 文件的源代码，因为我无法找到它们的 cdns。图片将不可用，但您仍然可以看到第一个和第二个选项是斜体和粗体。

注意:我在这里所做的唯一更改是更改粗体和斜体属性的位置，如我之前所述。