2016-11-11 77 views
0

我限制了可添加爲特殊頁面(事件提交頁面)內容的字符數。它在WordPress中的文本或代碼模式下工作正常,但在使用WYSIWYG編輯器時不起作用。WordPress所見即所得編輯器的字符限制

任何想法如何改變它,所以它也可以使用WordPress編輯器?

非常感謝!

這是我使用的JS。

 // Set your character limit 
    var count_limit = 1000; 

    // Set the initial symbol count on page load 
    $('#tcepostcontent-wc span').html($('#tcepostcontent').val()); 

    $('#tcepostcontent').on('keyup', function() { 
     var char_count = $(this).val().length; 
     var tcepostcontent = $(this).val(); 
     var text_remaining = count_limit - char_count; 

    // Update the character count on every key up 
    $('#tcepostcontent-wc span').html(text_remaining); 

    if (char_count >= count_limit) { 
     $('#tcepostcontent-wc').css('color', 'red'); 
     $(this).val(tcepostcontent.substr(1, count_limit)); 
    } else { 
     $('#tcepostcontent-wc').css('color', null); 
    } 

    }).after('<p id="tcepostcontent-wc">Max 1000 are available <span>1000</span></p>'); 
+0

嘿那裏,任何人都可以幫助嗎?將不勝感激。 – Torsten

回答

1

WordPress的可視化編輯器是TinyMCE,他實現了一個自定義API,您可以使用它來解決這個問題。您應該使用下面的源代碼,將它添加到一個小的自定義插件中,更改編輯器的ID號爲tinyMCE.activeEditor.editorId,激活它並完成。

add_filter('tiny_mce_before_init', 'wpse24113_tiny_mce_before_init'); 
function wpse24113_tiny_mce_before_init($initArray) { 

    $initArray['setup'] = <<<JS 
[function(ed) { 
    ed.onKeyDown.add(function(ed, e) { 
     if (tinyMCE.activeEditor.editorId == 'content-id') { 

      var content = tinyMCE.activeEditor.getContent(); 
      var max = 300; 
      var len = content.length; 

      if (len >= max) { 
       $('#charNum').html('<span class="text-error">You've got more then '+max+' characters!</span>'); 
      } else { 
      var charCount = max - len; 

      $('#charNum').html(charCount + ' characters left'); 
      } 
     } 
    }); 

}][0] 
JS; 

    return $initArray; 
} 

該來源是從this answer在SE論壇的WordPress主題。

+0

感謝您的這一點,但我不知道如何使用它。我已經有一個名爲「字數和限制」的插件,它可以在所有帖子和頁面的後端工作,也可以用於社區事件插件,但在前端使用插件時不會。任何想法? – Torsten

+0

在前端,這是一個足夠的差異。我不知道你在前端使用了什麼編輯器。如果您也使用TinyMCE,那麼它也應該可以工作。但是,您的插件可能會檢查它是否只在管理區域中有效。 – bueltge

+0

這是一個好點 - 歡呼聲,我會檢查出來:-) – Torsten

0

它在文本模式下工作,但不適用於視覺(這裏是「visuell」)。

它應該只是挑選正確的編號的權利,但無論我選擇(#tinymce,tcepostcontent_ifr等)它不起作用。

非常感謝您的幫助!

乾杯, Torsten