Javascript: последний символ текстовой области не пишется с большой буквы

Question

Редактирование приложения Shopify.Последний символ в текстовой области не становится заглавным на изображении метки, если вы не щелкнете за пределами текстовой области.

$(function() {
    $('#cstedit-addembossing').keyup(function() {
        this.value = this.value.toUpperCase();
    });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea maxlength="10" data-area="back" class="customify-text" data-target="addembossing" id="cstedit-addembossing" placeholder="Write a name, special date, quote, and the list goes on"></textarea>

Answer 1

Возможно, вы ищете событие, отличное от keyup.input лучше всего подходит для того, что вы пытаетесь сделать IMO.

$(function() {
    $('#cstedit-addembossing').on("input", function() {
        this.value = this.value.toUpperCase();
    });
});

Answer 2

// those listeners are added by customizer-final-v33.js
foo.addEventListener('change', e => display.textContent = foo.value);
foo.addEventListener('input', e => display.textContent = foo.value);

// this is basically your listener
foo.addEventListener('keyup', e => foo.value = foo.value.toUpperCase());

<textarea id="foo"></textarea>
<hr />
<h1 id="display">Type and texarea will update this text.</h1>

Чтобы исправить это, вы идете:

// those listeners are added by customizer-final-v33.js
foo.addEventListener('change', e => display.textContent = foo.value);
foo.addEventListener('input', e => display.textContent = foo.value);

// this is basically a working version your listener
foo.addEventListener('keydown', (e) => {
  event.preventDefault();
  foo.value = foo.value + String.fromCharCode(e.keyCode).toUpperCase();
  foo.dispatchEvent(new CustomEvent('input', { bubbles: true }));
})

<textarea id="foo"></textarea>
<hr />
<h1 id="display">Type and texarea will update this text.</h1>