切り替えとjQuery UIボタン

Question

私は私のユーザーのエディタの2種類のいずれかを使用するオプションを与えたいと思います：

• HTMLエディタ
• MCEエディタ

私が扱うことができますエディタを選択してその作業を行うことについては、これをコーディングしてください。しかし、私はUI側で問題を抱えています。最初はユーザーにチェック・ボックスを与えましたが、jQueryのUIボタンを使用してこれを切り替えて、「HTMLエディター」または「MCEエディター」のいずれかのテキストを表示することをお勧めします。誰もこれに似た何かをコード化しましたか？私はボタンのドキュメントを見てきましたが、どうやって2つの状態を切り替えることができるかはまだ分かりません。

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>