Проверка поля телефона в html, чтобы разрешить цифры и текст, но не @

Вам нужна функция для проверки только символа @, чтобы избежать этого, поэтому:

function avoidEmailPartCharacter(event) {
  const code = event.keyCode || event.which;
  if (code === 64) {
    event.preventDefault();
  }
}

затем вы передаете функцию обработчику ввода keypress, например:

<input type = "type" keypress = {avoidEmailPartCharacter(this)} />

это должно сработать

Предпочтительно переместить такую ​​логику из шаблона в специальную функцию, однако, в случае, если вам действительно нужно сделать это встроенным, можно сопоставить входной символ с регулярным выражением следующим образом:

<input type = "text"
       maxLength = "40"
       onkeypress = "return !!String.fromCharCode(event.which || event.charCode).match(/[\dext\[\]\-]/)"
       required
       name = "phone"
       id = "phonecontactselection"
>

Вы можете использовать контрольная работа и класс персонажа и перечислить свои символы, которым вы позволите сопоставить.

В этом случае сопоставьте один из [, ], символ a-z, точку или дефис:

[\][a-z.-]

<input 
 type = "text" 
 maxlength = "40" 
 onkeypress = "return /[\][a-z.-]/.test(String.fromCharCode(event.which || event.keyCode));"   
 required 
 name = "phone" 
 id = "phonecontactselection"
>