Kendo UI Editor - 更改字體顏色選擇器和背景顏色選擇器的默認顏色

我使用Kendo UI編輯器，我想選擇在字體和背景顏色調色板中顯示哪種顏色。或者另一種選擇是讓用戶從自定義顏色選擇器中進行選擇。Kendo UI Editor - 更改字體顏色選擇器和背景顏色選擇器的默認顏色

我發現在論壇上的例子，但它們都使用劍道2012年的舊版本的2016年最新版本R3不知道這樣的定義：kendo.ui.editor.ColorPicker.fn.options.colors它說，它是不確定的：

Uncaught TypeError: Cannot read property 'fn' of undefined

是否有辦法去做這個？我在論壇看了看到這個答案，但這是行不通的。

kendo.ui.editor.ColorPicker.fn.options.colors = ["c3c3c3", "b97a57", "ffaec9", "ffc90e", "efe4b0", "b5e61d", "99d9ea", "7092be", "c8bfe7"];

來源

2016-12-28 Asaf Epelbaum

更新：用戶問題後劍道UI的最新版本的解決方案的工作進行了修改
我已經討論了使用最新版本的劍道上這個博客的解決方案。請點擊下面的鏈接導航到解決方案。

Kendo UI Editor - Change default colors of font color picker and background color picker

簡單的鏈接soultion是這樣的代碼：

<script> 
$("#editor").kendoEditor({ 
    tools: [{ 
     name: "backColor", 
     palette: ["#f0d0c9", "#e2a293", "#d4735e", "#65281a"] 
     }, 
     { 
      name: "foreColor", 
      palette: ["red", "green", "#d47eee", "#65281a"] 
     } 
    }] 
}); 
</script>

老：此解決方案，但只有劍道2012版本。

這裏是工作的現場演示環節 - Editor color picker

HTML

<!DOCTYPE html> 
<html> 
<head> 
<link href="http://cdn.kendostatic.com/2012.3.1315/styles/kendo.common.min.css" rel="stylesheet" type="text/css" /> 
<link href="http://cdn.kendostatic.com/2012.3.1315/styles/kendo.default.min.css" rel="stylesheet" type="text/css" /> 
<link href="http://cdn.kendostatic.com/2012.3.1315/styles/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" /> 
<link href="http://cdn.kendostatic.com/2012.3.1315/styles/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" /> 
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
<script src="http://cdn.kendostatic.com/2012.3.1315/js/kendo.all.min.js"></script> 
<meta charset=utf-8 /> 
<title>JS Bin</title> 
</head> 
<body> 
    <textarea id="textarea" rows="10" cols="30" style="width:100%;height:400px"> 
      &lt;p&gt;&lt;img src=&quot;http://www.kendoui.com/Image/kendo-logo.png&quot; alt=&quot;Editor for ASP.NET MVC logo&quot; style=&quot;display:block;margin-left:auto;margin-right:auto;&quot; /&gt;&lt;/p&gt; 
      &lt;p&gt; 
       Kendo UI Editor allows your users to edit HTML in a familiar, user-friendly way.&lt;br /&gt; 
       In this version, the Editor provides the core HTML editing engine, which includes basic text formatting, hyperlinks, lists, 
       and image handling. The widget &lt;strong&gt;outputs identical HTML&lt;/strong&gt; across all major browsers, follows 
       accessibility standards and provides API for content manipulation. 
      &lt;/p&gt; 
      &lt;p&gt;Features include:&lt;/p&gt; 
      &lt;ul&gt; 
       &lt;li&gt;Text formatting &amp; alignment&lt;/li&gt; 
       &lt;li&gt;Bulleted and numbered lists&lt;/li&gt; 
       &lt;li&gt;Hyperlink and image dialogs&lt;/li&gt; 
       &lt;li&gt;Cross-browser support&lt;/li&gt; 
       &lt;li&gt;Identical HTML output across browsers&lt;/li&gt; 
       &lt;li&gt;Gracefully degrades to a &lt;code&gt;textarea&lt;/code&gt; when JavaScript is turned off&lt;/li&gt; 
      &lt;/ul&gt; 
      &lt;p&gt; 
       Read &lt;a href=&quot;http://docs.kendoui.com&quot;&gt;more details&lt;/a&gt; or send us your 
       &lt;a href=&quot;http://www.kendoui.com/forums.aspx&quot;&gt;feedback&lt;/a&gt;! 
      &lt;/p&gt; 
    </textarea> 

</body> 
</html>

JavaScript文件

kendo.ui.editor.ColorPicker.fn.options.colors = ["c3c3c3"];  
$("textarea#editor").kendoEditor(); 

$('textarea').kendoEditor({ 
    encoded: false, 
    tools: [ 
    "bold", 
    "italic", 
    "underline", 
    "strikethrough", 
    "fontName", 
    "fontSize", 
    "foreColor", 
    "backColor", 
    "justifyLeft", 
    "justifyCenter", 
    "justifyRight", 
    "justifyFull", 
    "insertUnorderedList", 
    "insertOrderedList", 
    "indent", 
    "outdent", 
    "formatBlock", 
    "createLink", 
    "unlink", 
    "insertImage", 
    "viewHtml" 
    ] 
});

來源

2016-12-28 18:36:00

嗨，感謝您的答案，但我認爲你的例子是基於舊版本的劍道。（我認爲它是從2012年開始的）。最新版本2016 R3不知道這樣的定義： kendo.ui.editor.ColorPicker.fn.options.colors 它說，它是不確定的：「遺漏的類型錯誤：無法讀取屬性‘FN’未定義」 –

@AsafEpelbaum - 你必須編輯你的問題。並且首次正確詢問，因爲它需要花費很多精力和研究。 –

對不起。我沒有考慮到這一點。對不起，感謝你的努力！ Upvoted –

Kendo UI Editor - 更改字體顏色選擇器和背景顏色選擇器的默認顏色

回答

相關問題