2

我是菜鸟的定义，我不知道我在做什么。我必须使用 javascript 创建一个函数来对表单中的“名称”字段执行验证。检查将查看是否输入了任何内容或名称是否包含数字。最重要的是，我必须使用 onchange 事件。我尝试搜索，我得到了答案，我看到答案中有 jquery 代码，我不能在这个问题中使用它。我不知道该怎么做，有人可以帮忙吗？这是我正在使用的表格

     <form method="get">
        <label for="name">Name</label>
        <input type="text" id="name" placeholder="Name" onChange="" >
        <br>
        <label for="age">Age</label>
        <input type="age" id="age" placeholder="Age">
        <br>
        <label for="location">Location</label>
        <input type="location" id="location" placeholder="Location">
        <br>
        <button type="submit">Submit</button>
    </form>
4

1 回答 1

1

这是一个带有输入参数的 javascript 函数。它将使用正则表达式检查输入值中是否包含任何数字字符。如果是这样，它会发送一个警报，然后删除所有数字字符（再次使用正则表达式）。然后它将检查输入值是否为空字符串，如果是则发送警报。

function checkName(input) {

    // Check if input contains a digit
    if (/\d/.test(input.value)) {
        alert('Name contains a number');

        // Remove all digit characters
        input.value = input.value.replace(/\d/gi, '');
    }

    // Check if input is empty
    if (input.value === '') {
        alert('Name is empty');
    }

    return true;
}​

将您的函数调用添加到输入的 onChange 属性，传入此对象作为函数的变量引用：

    <input type="text" id="name" placeholder="Name" onChange="checkName(this)" >

这是一个演示此工作的演示：http:
//jsfiddle.net/PMKsS/1/

有什么要注意的。此函数只会在名称输入值更改时调用，因为这就是 onChange 调用将执行的操作。因此，表单提交时不会检查名称输入是否为空。

此外，这值得一读：为什​​么在 HTML 中使用 onClick() 是一种不好的做法？. 它解释了如何通过 javascript 而不是通过属性添加 javascript 事件侦听器，以及为什么采用其他方式不是很好。虽然它没有提供在纯 javascript 中执行此操作的方法。

于 2012-11-05T05:59:44.457 回答