Project DescriptionA jQuery plugin to Autosize a textarea whenever a key is released or text is pasted.
Installhttps://www.nuget.org/packages/jquery.autoSizeTextArea.jsChange logv 1.0.1
- Removed the input event bind because with <= IE9 it doesn't detect backspace or delete. Also, it was causing double the work because it is fired whenever keyup is fired.
- The previous paste event bind was useless because at the time of the event, the text hasn't changed. A 100ms delay has been added to ensure the text is there.
- Added a cut event bind, because of the removal of the input event bind. This also has a 100ms delay.
v 1.0.2
UsageHTML:
<!--Don't use the 'cols' attribute on the textarea, use a style or class to specify a width-->
<textarea id="textarea1" style="width:450px;"></textarea>
<textarea id="textarea2" style="width:450px;height:100px;"></textarea>
Initialize the textarea:
<script>
$("#textarea1").autoSizeTextArea();
</script>
Specify a callback whenever the textarea re-sizes:
<script>
$("#textarea1").autoSizeTextArea({ onResize: function() { console.log($(this).height(); } });
</script>
Specify a minimum height
<script>
$("#textarea2").autoSizeTextArea({ minHeight: 100 });
</script>
All properties can be set globally; specify that the textarea should be re-sized as soon as a key is released (the default delay is 100ms):
<script>
$.fn.autoSizeTextArea.defaults.keyupDelay = null;
</script>
A textarea is re-sized whenever a key-up or paste event occurs. If text is programatically pasted into the textarea, you can update the size manually:
<script>
$("#button1").click(function () {
$("#textarea1").val("Lorem ipsum dolor...").autoSizeTextArea('update');
});
</script>
Specify a callback for after text has been pasted into the textarea:
<script>
$("#textarea1").autoSizeTextArea({ onPasted: function() { console.log($(this).val(); } });
</script>