Question

我想让我的用户可以选择使用两种编辑器中的一种：

HTML编辑器
MCE编辑

在选择编辑器并使其工作时，我可以处理这种编码。但是我遇到了UI方面的问题。起初我给了用户一个复选框，但现在我想更好的方法是使用jQuery UI按钮并切换它以显示文本“HTML Editor”或“MCE Editor”。有没有人编码类似的东西？我查看了按钮的文档，但我仍然不清楚如何在两种状态之间切换。

Answer 1

确保您的HTML中有一个ID为toggleButton的按钮。

var isMCE = false;

$("#toggleButton").click(function() {
    if(isMCE) {
        // change your editor back to normal here
        isMCE = false;
    } else {
        // change your editor to MCE here
        isMCE = true;
    }
});

toggle()，根据here，只是切换元素的可见性，并不适合您的目的。

Answer 2

    $( "#controls #html" ).button({
                text: 'Edit',
                })
                .click(function() {
                     var btn = $("#controls #html");
                     btn.button('option', 'text', 'MCE');
                     if (btn[0].checked) {
                           btn.button('option', 'text', 'HTML');
                           doMCE();
                     } else { 
                           btn.button('option', 'text', 'MCE');
                           doHTML();
                     }
                });

    <div id="controls">
         <input type="checkbox" id="html" name="html"><label for="html"></label>
    </div>

切换和jQuery UI按钮

2 个答案: