TinyMCE字符计数不正确

Question

我在我的页面中的textarea上使用TinyMCE.我试图获得字符和单词计数,并输入textarea.我一直在尝试各种版本,以使其正常工作,但没有成功.这是最新的越野车版本:

$().ready(function() {
    $('textarea.tinymce').tinymce({
        // Location of TinyMCE script
        script_url: 'jscripts/tiny_mce/tiny_mce.js',

        // General options
        theme: "advanced",
        plugins: "autolink,lists,pagebreak,style,layer,table,save,advhr,advimage,advlink,emotions,iespell,inlinepopups,insertdatetime,preview,media,searchreplace,print,contextmenu,paste,directionality,fullscreen,noneditable,visualchars,nonbreaking,xhtmlxtras,template,advlist",

        // Theme options
        theme_advanced_buttons1: "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,styleselect,formatselect,fontselect,fontsizeselect",
        theme_advanced_buttons2: "cut,copy,paste,pastetext,pasteword,|,search,replace,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
        theme_advanced_buttons3: "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,print,|,ltr,rtl,|,fullscreen",
        theme_advanced_buttons4: "insertlayer,moveforward,movebackward,absolute,|,styleprops,|,cite,abbr,acronym,del,ins,attribs,|,visualchars,nonbreaking,template,pagebreak",
        theme_advanced_toolbar_location: "top",
        theme_advanced_toolbar_align: "left",
        theme_advanced_statusbar_location: "bottom",
        theme_advanced_resizing: true,

        // Example content CSS (should be your site CSS)
        content_css: "css/content.css",

        // Drop lists for link/image/media/template dialogs
        template_external_list_url: "lists/template_list.js",
        external_link_list_url: "lists/link_list.js",
        external_image_list_url: "lists/image_list.js",
        media_external_list_url: "lists/media_list.js",

        // Replace values for the template plugin
        template_replace_values: {
            username: "Some User",
            staffid: "991234"
        },

        //setup:'tmceWordcount'
        setup: function(ed) {

            ed.onKeyUp.add(function(ed, e) {

                //Following does not work correctly
                //var strip = (tinyMCE.activeEditor.getContent()).replace(/(<([^>]+)>)/ig,"");

                //Neither does the code below
                var strip = (tinyMCE.activeEditor.getContent()).replace(/<[^>]+>/g, "");


                var text = strip.split(' ').length + " Words, " + strip.length + " Characters"
                tinymce.DOM.setHTML(tinymce.DOM.get(tinyMCE.activeEditor.id + '_path_row'), text);
            });
        }

    });
});

这是我的例子.我正在输入第一个单词:Me 当我输入第一个单词时,它会正确显示字符和单词.但是只要我按空格键输入下一个单词,就会显示字符是8.如何？IMO,它也包括HTML标签.对于上面输入的文本,HTML代码如下:

<p>Me&nbsp;</p>

我希望输出为1个字和3个字符(2个字符+ 1个空格).但它向我展示了另外5个角色.这是怎么回事？如何阻止它？如果输入下一个单词,则一旦开始输入,它就会显示正确的字符数.但是当你再次击中空间时,它会添加更多角色.因此,只要空间和输入按钮被击中,这个问题似乎就会发生.怎么解决这个问题？

Answer 1

如果你想做这样的事情，那么必须添加一个 jQuery 函数，如下所示：http ://jsfiddle.net/uA9Jx/

jQuery.fn.stripTags = function() {
        return this.replaceWith( this.text().replace(/<\/?[^>]+>/gi, '') );
};

假设这是您的 HTML：

<textarea id='bar'>This is <b>bold</b> and this is <i>italic</i>.</textarea>

然后你就可以：

$("#bar").stripTags();

这将导致：

This is bold and this is italic.

或者此代码的工作原理类似：http ://jsfiddle.net/cwbMX/

$("#bar").html( $("#bar").text().replace(/<\/?[^>]+>/gi, '') );