使用Javascript将我的html输入限制为只有文本并警告用户否则

Using Javascript to limit my html input to only text and alerting the user otherwise?

本文关键字：文本 警告 用户 我的 Javascript html 输入 使用      更新时间：2023-09-26

所以基本上我已经在HTML中为一个人的名字和姓氏创建了输入字段。我希望这个字段限制他们的输入，只有文本，并给他们一个警告，否则使用香草JS请。

下面是HTML代码:

<div>
        First Name:<br> <input id="name" type="text" placeholder="Type Here" pattern="[A-Za-z]"><br>
        Last Name:<br> <input id="name" type="text" placeholder="Type Here" pattern="[A-Za-z]">
</div>

正如你所看到的，我以前试图通过使用pattern="方法来限制输入，我在另一篇文章中看到，但不能让它工作。关于这方面的建议我也很感激。

这是我的JS函数现在的样子:

var nameinput=document.getElementById('name').value;
var input=function(field){
    if(isNaN(field)===false || field===""){
        alert('Please Enter Your Name');
        return false;

    }
}
input(nameinput)

这可能是显而易见的。我很新的JS，但任何帮助将非常感激!

如果你想让它一直检查，试着实现一个自定义的onChange回调，即<input type="text" name="firstName" onChange="verif()">，或者，如果你想让它只在提交时进行验证，添加onSubmit="verif()"到您的表单。对于这两种情况，verif()函数看起来像

function verif(){
  var firstName = document.getElementByName("firstName")[0].value;
  if(!firstName.match(/['A-Za-z]+/i)) {
    alert("You can only enter characters");// Or whatever message
    document.getElementByName("firstName")[0].focus();
  }
  var lastName = document.getElementByName("lastName")[0].value;
  if(!lastName.match(/['A-Za-z]+/i)) {
    alert("You can only enter characters");// Or whatever message
    document.getElementByName("lastName")[0].focus();
  }
}
顺便说一下，这段代码假设您对输入使用name属性，您应该总是对输入使用name属性。你也不应该两次使用相同的id。
相关文章：