如何按空格键，然后在文本区域中按Backspace键：使用JQuery？

Question

Do we have any way to press any keyboard key in textarea using JQuery?

Usage in My Case There are many textareas have height of 100, set by default onload (some issue with JQuery Autosize used by some developer of which i have no access to change and i am not authorized to change). There is some text displayed in textarea. If it is less say 10 character only, the height of textarea will Remain same.

Now when end user click in Textarea and then press any button to edit, then at sudden textarea gets adjusted to normal height.

So i want jquery to fire key-press(space then backspace) on load on all textareas. Do we have any way to press any keyboard key in textarea using JQuery?

Answer 1

You can use the trigger event. See my jsfiddle

$("textarea").each(function(){
    var d = $.Event('keydown');
    var e = $.Event('keydown');
    d.which = 32; // space
    e.which = 8; // backspace
    this.focus();
    this.trigger(d);
    this.trigger(e);
}

Manually trigger resize:

$('textarea').each(function(){
    var evt = document.createEvent('Event');
    evt.initEvent('autosize:update', true, false);
    $(this).dispatchEvent(evt);
});

Destroying autoresize:

$('textarea').each(function(){
    var evt = document.createEvent('Event');
    evt.initEvent('autosize:destroy', true, false);
    $(this).dispatchEvent(evt);
});

Answer 2

As unable to trigger click so used following code to increase and decrease textarea:

autoHeight: function(e) {
    $(e).css({'height':'auto','overflow-y':'hidden'}).height(e.scrollHeight);

},

setTimeout(function(){
        $('textarea').each(function () {
            kontroll.autoHeight(this);
        }).on('input', function () {
            kontroll.autoHeight(this);
        });
    }, 200);