Dead simple HTML-safe truncation via the DOM.
Branch: master
Clone or download
Latest commit b34728c Mar 23, 2017
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
test add an option to be able to finish the block before we truncate the c… Mar 3, 2017
.gitignore Phantom runner, upgrade qunit. Jul 18, 2013
.travis.yml Node 0.10. Sep 13, 2013
LICENSE Initial commit. Apr 19, 2012
README.md add an option to be able to finish the block before we truncate the c… Mar 3, 2017
bower.json Create bower.json file having version Apr 7, 2016
jquery.truncate.js add an option to be able to finish the block before we truncate the c… Mar 3, 2017
package.json

README.md

Build Status

Usage

jQuery.truncate(html, options)

> jQuery.truncate('<p>Stuff and <i>Nonsense</i></p>', {
  length: 13
});
'<p>Stuff and <i>No…</i></p>'

$el.truncate(options)

> jQuery('<p>Stuff and <i>Nonsense</i></p>').truncate({
  length: 13
}).html();
'<p>Stuff and <i>No…</i></p>'

Options

Default options are stored on jQuery.truncate.defaults.

length

Default: Infinity

The maximum length (including the ellipsis) of the truncated html.

stripTags

Default: false

If stripTags is truthy all html tags will be stripped, leaving only the text.

> jQuery.truncate('<p>Stuff and <i>Nonsense</i></p>', {
  length: 13,
  stripTags: true
});
'Stuff and No…'

words

Default: false

If words is truthy the input will only be truncated at word boundaries.

> jQuery.truncate('<p>Stuff and <i>Nonsense</i></p>', {
  length: 13,
  words: true
});
'<p>Stuff and…</p>'

keepFirstWord

Default: false

When words and keepFirstWord are both truthy the input will contain at least one word beside the ellipsis even if it's longer than a target length.

> jQuery.truncate('<p>Stuff and <i>Nonsense</i></p>', {
  length: 4,
  words: true,
  keepFirstWord: true
});
'<p>Stuff…</p>'

finishBlock

Default: false

When finishBlock is true it will always truncate the content at the end of the block.

> jQuery.truncate('<p>Stuff and <i>Nonsense</i> and something else</p>', {
  length: 13,
  finishBlock: true,
});
'<p>Stuff and <i>Nonsense…</i></p>'

noBreaks

Default: false

If noBreaks is truthy the input will contain no break elements.

> jQuery.truncate('<p>Stuff and<br><i>Nonsense</i></p>', {
  length: 13,
  noBreaks: true
});
'<p>Stuff and <i>No…</i></p>'

ellipsis

Default: '…'

The ellipsis setting is used to provide a different character for the ellipsis.

> jQuery.truncate('<p>Stuff and <i>Nonsense</i></p>', {
  length: 13,
  ellipsis: '~'
});
'<p>Stuff and <i>No~</i></p>'