使用 setInterval 轮询 CLEDITOR 的性能成本答案

【问题标题】：Cost of Performance on using setInterval to poll CLEDITOR使用 setInterval 轮询 CLEDITOR 的性能成本
【发布时间】：2015-07-02 18:20:33
【问题描述】：

我正在使用CLEditor WYSIWYG 并试图做一个解决方法来访问 iframe 内容并计算字符（我知道关于如何不应该在所见即所得上限制字符的整个辩论，但我需要显示文本表示用户输入了多少个字符（不在乎生成了多少实际 HTML）。我能够通过使用 setInterval() 作为 CLEditor 更改的事件挂钩来实现字符数在模糊时触发。

我真正的问题：

使用 setInterval() 是否会损害性能，或者我应该使用其他方法来轮询更改的文本？

这是我目前使用的方法：

       function checkChange(){
            $(document).ready(function() {
                var t = $("#edFrame").contents().find("body").text().length;

                $(".limitCounter").text(t);

            });
        }


        $(document).ready(function () {

            $(".wysiwyg").cleditor();


            setInterval('checkChange()', 50);


        });

【问题讨论】：

标签： javascript jquery wysiwyg cleditor

【解决方案1】：

IMO，您以错误的方式处理此问题。您应该设置一个事件处理程序，在文本更改时触发一个事件。由于您使用的是 jQuery，请查看 jQuery 事件：http://api.jquery.com/category/events/。具体来说，请阅读.change() 事件，因为我认为这是您想要使用的。您将一个事件附加到您的对象 (#edFrame)，并指定在触发该事件时要调用的函数。

您已经实现了一个忙碌等待系统，虽然它可以工作，但远非最佳设计，并且将来可能会让您头疼。

【讨论】：

【解决方案2】：

按照前面的评论，可以这样完成：

$("#edFrame").cleditor().on('change', function () { 
   var t = $(this)[0].$area.val().length;
   $(".limitCounter").text(t)
});

请记住，显示的长度会计算文本字符以及格式标记。

【讨论】：