2011-10-05 91 views
-1

林尋找一個非常簡單的編輯器爲我的論壇。非常非常簡單富文本/所見即所得的編輯器

我只對基本功能感興趣,比如粗體,斜體,下劃線,blockquote - 沒有其他的東西,沒什麼不足。 另一個重要特徵是,當用戶將格式化文本粘貼到textarea中時,所有標籤都應該被剝離。

林熟悉TinyMCE的,CKEditor的和其他一些「大」的編輯,但我認爲它矯枉過正,對這種基本功能,一個大大的「框架」 ..

伊夫看遍了「類似問題「,但沒有一個建議編輯很簡單,我想..

你們知道嗎?

回答

0

很難定義「簡單」。

有很多rich text editors哪些按鈕你想要顯示在工具欄中。

看看this具有基本特徵的最小測試編輯器示例:粗體,斜體和通過熱鍵下劃線。

或者查看execCommands的另一個示例,您可以使用該示例使您的自己的簡化的縮小文本編輯器。你可以控制按鈕工具欄等的設計。它有命令列表和這個非常小的代碼將它們變成富文本編輯器。

angular.module("myApp", []) 
    .directive("click", function() { 
     return { 
      restrict: "A", 
      link: function (scope, element, attrs) { 
       element.bind("click", function() { 
        scope.$evalAsync(attrs.click); 
       }); 
      } 
     }; 
    }) 
    .controller("Example", function ($scope) { 
     $scope.supported = function (cmd) { 
      var css = !!document.queryCommandSupported(cmd.cmd) ? "btn-succes" : "btn-error" 
      return css 
     }; 
     $scope.icon = function (cmd) { 
      return (typeof cmd.icon !== "undefined") ? "fa fa-" + cmd.icon : ""; 
     }; 
     $scope.doCommand = function (cmd) { 
      if ($scope.supported(cmd) === "btn-error") { 
       alert("execCommand(「" + cmd.cmd + "」)\nis not supported in your browser"); 
       return; 
      } 
      val = (typeof cmd.val !== "undefined") ? prompt("Value for " + cmd.cmd + "?", cmd.val) : ""; 
      document.execCommand(cmd.cmd, false, (cmd.val || "")); 
     } 
     $scope.commands = commands; 
     $scope.tags = [ 
    'Bootstrap', 'AngularJS', 'execCommand' 
    ] 
    }) 
相關問題