Countable.js 实时统计文本框里面的字数段落和字符

发布于 2018-08-15 21:35:13 字数 1575 浏览 1911 评论 0

Countable.js 是一个实时统计一个多行文本框里面有多少段落和字数的 JavaScript 函数,他不依赖任何框架或者脚本,使用方便,在很多地方都在使用他。

Countable.js 实时统计文本框里面的字数段落和字符

安装 Countable.js

安装的首选方法是使用 bower 安装

bower install Countable

当然您也可以下载最新版本的 zip 压缩包,或者是复制源代码到您的项目中。

使用Countable.js

Countable.js 的使用非常简单和易用,您可以在您的项目中使用 Countable.live() 或者 Countable.once() 方法,接收一个或多个 HTML 元素和一个回调函数,一个或这是多个 HTML 函数为统计数据显示的标签元素。

1、可用的方法

调用 Countable.live() 函数

var area = document.getElementById('area')
Countable.live(area, function (counter) {
  console.log(counter)
})

从一个元素中删除绑定的 Countable.live() 方法可以使用die函数

Countable.die(area)

还有一种情况,您只想显示一个元素的字数,例如您想在您的博客中显示文章的字数,您可以使用 Countable.once() 方法

Countable.once(area, function (counter) {
  console.log(counter)
})

Countable.js 还提供了方法检测上面的方法是否成功执行了,可以使用 Countable.enabled() 方法

Countable.enabled(area)

2、调用参数

Countable.live()Countable.once() 接收一个或 3 个参数和一个回调函数,允许您改变统计的方式

{
  hardReturns: false,
  stripTags: false
}
  • 默认情况下,Countable.js 认为一个换行就是一个段落,当然您也可以指定 hardReturnstrue,规定两个换行为一个段落。
  • HTML 标签可能不能算作文章的内容,如果你想要一起统计,那么将 stripTags 设置为 true 即可实现。

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据

关于作者

JSmiles

生命进入颠沛而奔忙的本质状态,并将以不断告别和相遇的陈旧方式继续下去。

0 文章
0 评论
84960 人气
更多

推荐作者

qq_Yqvrrd

文章 0 评论 0

2503248646

文章 0 评论 0

浮生未歇

文章 0 评论 0

养猫人

文章 0 评论 0

第七度阳光i

文章 0 评论 0

新雨望断虹

文章 0 评论 0

    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文