我的 preventDefault 在 jQuery function 中不起作用

Question

I have something like this HTML structure.

<input type="text" id="client-first-name" autocomplete="given-name" class="input-small error" data-bind="value: firstName, validate: 'alphaNumericPunctuation', valueUpdate:'afterkeydown', required: true, disable: loading">

I'm trying to do a validation so that the input only accepts text. All validation works correctly but prototype preventDefault() is not working. My code:

$(document).ready(function () {
  $("#client-first-name").keyup(function(event){

    if(!/^[A-Z]+$/i.test(event.key)){
        event.preventDefault()

      }
  })
})

Answer 1

Use input event instead, as it won't work. And get the last character of event.target.value

$(document).ready(function () {
  $("#client-first-name").on('input', function(event){

    var newValue = event.target.value

    if(!/^[A-Z]+$/i.test(newValue[newValue.length - 1])){
      event.preventDefault()
    }
  })
})