Tiny jQuery Plugin To Highlight Text In Textarea

File Size: 9.03 KB
Views Total: 5517
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Tiny jQuery Plugin To Highlight Text In Textarea

Highlight Within Textarea is a simple, lightweight jQuery plugin which allows you to highlight text inside of <textarea> element using Regex or Array.

See also:

Basic usage:

1. Add the necessary JavaScript and CSS files into your web project.

<script src="/path/to/jquery.min.js"></script>

<!-- highlight-within-textarea CSS/JS -->
<link href="jquery.highlight-within-textarea.css" rel="stylesheet">
<script src="jquery.highlight-within-textarea.js"></script>

2. Create a Regex rule to highlight text typed in the <textarea>. In this case, the plugin will highlight all numbers found in your <textarea>.

function onInputRegex() {
  return /\d+/g;
}

3. Call the function on the target <textarea> element and done.

$('textarea').highlightWithinTextarea({ onInput: onInputRegex });

Change logs:

2017-09-23

  • One missing semicolon

2017-05-30

  • Fixed for IE11.

2017-04-29

  • Fix mark style be play nice with Bootstrap
  • Fix to escape HTML input

2016-07-07

  • Fix to escape HTML input

v1.0.2 (2015-09-28)

  • Extra offset to hide scrollbar in Firefox.

2015-09-27

  • Language tweaks, scroll fix
  • Fixed some wacky edge case scrolling bugs.

2015-09-24

  • fixed for IE.

2015-09-18

  • Simpler instantiation, updated sample code.

2015-09-14

  • JS update
  • more demos

This awesome jQuery plugin is developed by lonekorean. For more Advanced Usages, please check the demo page or visit the official website.