TinyMCE文本编辑器最大字符限制
TinyMCE text editor max char limit
我将TinyMCE用于<textarea>
。我的要求是将字符大小限制为2000,并在工具栏下方的某个位置显示其余字符。我设法弄到了字符数;现在我只能显示剩下的字符,防止超过限制。
这是我的TinyMCE代码
tinyMCE.init({
// General options
mode : "textareas",
theme : "simple",
plugins : "autolink,lists,pagebreak,style,table,save,advhr,advimage,
advlink,emotions,media,noneditable,visualchars,nonbreaking,
xhtmlxtras,template",
// Theme options
theme_advanced_buttons1 : "bold,italic,underline,strikethrough,|,
justifyleft,justifycenter,justifyright,
justifyfull,|,styleselect,formatselect,
fontselect,fontsizeselect",
theme_advanced_buttons2 : "bullist,numlist,|,outdent,indent,|,undo,redo,|,
link,unlink,anchor,image,code,|,forecolor,
backcolor",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_statusbar_location : "bottom",
theme_advanced_resizing : true,
charLimit : 10, // this is a default value which can get modified later
setup : function(ed) {
//peform this action every time a key is pressed
ed.onKeyUp.add(function(ed, e) {
//define local variables
var tinymax, tinylen, htmlcount;
//manually setting our max character limit
tinymax = ed.settings.charLimit;
//grabbing the length of the curent editors content
tinylen = ed.getContent().replace(/(<([^>]+)>)/ig,"").length;
//setting up the text string that will display in the path area
htmlcount = "HTML Character Count: " + tinylen + "/" + tinymax;
//if the user has exceeded the max turn the path bar red.
if (tinylen>tinymax){
}
});
}
});
为了测试的目的,我试图限制最多10个字符
欢迎提出任何建议。
我建议您在KeyDown上执行代码,因为在KeyUp上,字母已经在编辑器中了。
//peform this action every time a key is pressed
ed.onKeyDown.add(function(ed, e) {
//define local variables
var tinymax, tinylen, htmlcount;
//manually setting our max character limit
tinymax = ed.settings.charLimit;
//grabbing the length of the curent editors content
tinylen = ed.getContent().replace(/(<([^>]+)>)/ig,"").length;
//setting up the text string that will display in the path area
htmlcount = "HTML Character Count: " + tinylen + "/" + tinymax;
//if the user has exceeded the max turn the path bar red.
if (tinylen > tinymax){
// place text string in path bar
if ( $('#max_char_string').size() ){
$('#max_char_string').html( ' ' + htmlcount);
}
else {
$("div#"+ed.id+"_path_row").append('<span id="max_char_string"> '+htmlcount+'</span>')
}
// prevent insertion of typed character
e.preventDefault();
e.stopPropagation();
return false;
}
我遇到了同样的问题,发现这个链接非常有用:http://www.ryann.ca/?p=186
尽管我稍微更改了一下,以便它直接从文本区域读取maxlength的属性。
tinyMCE.init({
// Options
setup : function(ed) {
ed.onKeyUp.add(function(ed, e) {
var tinylen, htmlcount, maxlength = $("#" + tinyMCE.activeEditor.id).attr("maxlength");
if (maxlength) {
// grabbing the length of the curent editors content
tinylen = ed.getContent().length;
htmlcount = "HTML Character Count: " + tinylen + "/" + maxlength;
if (tinylen > maxlength) {
htmlcount = "<span style='font-weight:bold; color: #f00;'>" + htmlcount + "</span>";
}
// write the html count into the path row of the active editor
tinymce.DOM.setHTML(tinymce.DOM.get(tinyMCE.activeEditor.id+ '_path_row'), htmlcount);
}
});//ed.onKeyUp.add
}//setup
});
希望它能起作用:)
setup: function(ed) {
var maxlength = parseInt($('#'+(ed.id)).attr("maxlength"));
var count = 0;
ed.on('keydown', function(e) {
count++;
if (count >= maxlength)
{
alert("false");
return false;
}
});
},
相关文章:
- 拆分文本以每隔n个字符添加一行新行,并注意空格
- 允许在文本框中使用某些字符
- 根据页面的位置突出显示文本中的字符
- 带静态字符e输入的文本框数字和带javascript的负整数
- 仅IE8 html文本框中的字符
- 必须检查长度,并在文本框中允许一些特殊字符
- 在每个字符输入后,使密码文本框值可见
- 使用提取文本webpack插件时出现意外字符
- 替换与单词'匹配的文本字符;购物车'替换为img图标
- 以纯文本加载的脚本-未声明纯文本文档的字符编码
- Javascript:包括特殊字符的文本选择
- 如何在不通过模型验证的情况下屏蔽文本输入中输入的字符
- 匹配某个字符后所有文本的正则表达式是什么
- 文本区域JavaScript中的字符限制-特殊情况
- 如果文本或值以字符开头,请运行函数
- 更换163;使用javascript从html文本区域中提取字符
- 为什么jQuery正在删除文本的最后一个字符
- 重制版字符文本区域问题
- 字符文本中的字符过多,在 C# 中使用字符串生成器
- 尝试在煎茶面板中使用连字符文本,但不成功