如何驗證tinyMCE編輯器，如果它通過在其旁邊附加字符串爲空白？

我需要驗證表單。這個表單有一些下拉列表和tinyMCE編輯器，我通過在每個字段後面追加字符串「Required」來驗證這個表單，但是我無法驗證tinyMCE編輯器，如果編輯器是空白的，我嘗試了類似如何驗證tinyMCE編輯器，如果它通過在其旁邊附加字符串爲空白？

tinyMCE.get('tinyedotor').getContent();

但沒有運氣。

這裏是我的fiddle

來源

2012-01-05 Mike

getContent()應該只是罰款。你的小提琴不包含編輯器值的表單驗證代碼，這在這裏非常重要。試試這個：

var editorContent = tinyMCE.get('tinyeditor').getContent(); 
if (editorContent == '') 
{ 
    // Editor empty 
} 
else 
{ 
    // Editor contains a value 
}

Forked fiddle

還要注意你聲明的多重id的爲您select下拉。

編輯：你可以用getContainer()方法編輯器容器的id：tinyMCE.get('tinyeditor').getContainer()。那麼編輯後插入一個錯誤信息會是這樣的：

$('<span class="error">Editor empty</span>').insertAfter($(tinyMCE.get('tinyeditor').getContainer()));

然而，這會造成用戶點擊提交按鈕一個新的span每一次，所以你可能會希望有一個錯誤信息帶有獨特的id的容器，並在插入之前檢查容器是否已經存在。

編輯2：Updated fiddle。

來源

2012-01-05 20:52:14 Viktor

@Victor：太棒了，我可以做到這一點，但我的問題是把這個字符串放在tinyMCE旁邊。我不知道如何得到tinymCe的class/id，所以我可以做一些像$（「。errormrssage」）。appendTo（'tinyMCEEditor'的class/id）; – Mike 2012-01-06 05:13:16

@Mike：查看添加的代碼。 – Viktor 2012-01-06 09:42:48

@Victor：我添加了這段代碼，但看起來需要更多東西來刪除這裏的消息是小提琴http://jsfiddle.net/bvNMc/13/ – Mike 2012-01-06 10:35:38

getContent()是要走的路。你可以使用tinyMCE.activeEditor對象，然後調用getContent()或者通過id獲取編輯器實例，就像你正在做的一樣。

它看起來像你在你的編號中有一個錯字，這可能會導致你的問題。

tinyMCE.get('tinyedotor').getContent();

大概應該是：

tinyMCE.get('tinyeditor').getContent();

來源

2012-01-05 20:21:53 buley

這只是錯誤的問題，但我的代碼是正確的，你檢查小提琴 – Mike 2012-01-05 20:25:25

是的，我沒有看到任何'getContent'調用，只有'setContent'調用。我在尋找正確的代碼？此外，它目前正在拋出一個錯誤：'未捕獲的SyntaxError：意外的標識符' – buley 2012-01-05 20:31:15

你想要什麼都可以輕鬆完成。她是我的解決方案link to a fiddle。

來源

2012-01-06 15:59:56 Thariama

編輯信息空白必須與tinyMCE編輯器的最上面一行，現在它在中間。我可以使用絕對位置並使用頂部和左側尺寸，但這會打擾，因爲我的頁面有3個tinymce編輯器，並且只有一個基於某種邏輯顯示。我們可以在第一行的tinyMCE框中添加這條編輯器消息嗎？ – Mike 2012-01-06 19:44:10

@Mike：爲包含錯誤消息的表單元格對齊表格單元格內容：''。 – Viktor 2012-01-06 22:37:00

@Viktor：但我有一個div佈局。 – Mike 2012-01-07 07:12:03

你可以做到這一點，以檢查內容爲空，而不解析HTML：

var content = tinymce.get('tinymceEditor').getContent({format: 'text'}); 
if($.trim(content) == '') 
{ 
    // editor is empty ... 
}

來源

2014-07-29 13:51:08

非常有用，因爲如果有一些空格，以html格式，它不會被視爲空。 – Memochipan 2015-06-11 22:07:00

當你刪除格式過濾'{format：'text'}'時，它會更有用，因爲有時用戶不會寫入任何內容，而是插入文件/圖像。 – 2017-02-01 09:10:46

使用的getContent（）是正確的方法，但如果用戶進入該空間!! ??
這裏是正則表達式的完整解決方案 -

var content = tinyMCE.get('tinyeditor').getContent(), patt; 

      //Here goes the RegEx 
      patt = /^<p>(&nbsp;\s)+(&nbsp;)+<\/p>$/g; 

      if (content == '' || patt.test(content)) { 
       $('.bgcolor').css("border", "1px solid Red") 
       return false; 
      } 
      else { 
       $('.bgcolor').removeAttr("style") 
       return true; 
      }

注：（「.bgcolor」）不過是一個div圍繞‘tinyeditor’當驗證發生有紅色邊框。

來源

2016-12-14 14:03:07

如何驗證tinyMCE編輯器，如果它通過在其旁邊附加字符串爲空白？

回答

相關問題