请利用JQuery编写函数实现表单的校验,要求学号和姓名不能为空,年龄必须数字,才能实现表单的提交。 程序清单: function check()
时间: 2024-03-26 17:38:42 浏览: 51
好的,这是一个用jQuery实现表单校验的例子:
```
function check() {
var sno = $('#sno').val();
var name = $('#name').val();
var age = $('#age').val();
if (!sno || !name) {
alert('学号和姓名不能为空!');
return false;
}
if (!$.isNumeric(age)) {
alert('年龄必须是数字!');
return false;
}
// 校验通过,提交表单
return true;
}
```
解释一下,这个函数首先使用 jQuery 的 `val()` 方法获取表单中学号、姓名和年龄的值,然后对学号和姓名进行非空校验,如果为空则弹出提示框并返回 false。接着使用 jQuery 的 `isNumeric()` 方法对年龄进行数字校验,如果不是数字则弹出提示框并返回 false。最后,如果校验通过,则返回 true,表单将会被提交。
相关问题
利用JQuery编写函数实现表单的校验,要求学号和姓名不能为空,年龄必须数字,才能实现表单的提交
好的,下面是一个简单的利用JQuery编写函数实现表单校验的例子:
HTML代码:
```
<form id="myForm">
学号:<input type="text" id="idInput"><br>
姓名:<input type="text" id="nameInput"><br>
年龄:<input type="text" id="ageInput"><br>
<input type="submit" value="提交">
</form>
```
JQuery代码:
```
$(document).ready(function() {
$('#myForm').submit(function(event) {
// 阻止表单的默认提交行为
event.preventDefault();
// 获取表单中的输入值
var id = $('#idInput').val();
var name = $('#nameInput').val();
var age = $('#ageInput').val();
// 校验学号和姓名是否为空
if (id === '' || name === '') {
alert('学号和姓名不能为空');
return false;
}
// 校验年龄是否为数字
if (!$.isNumeric(age)) {
alert('年龄必须为数字');
return false;
}
// 如果校验通过,则提交表单
this.submit();
});
});
```
这段代码利用JQuery的submit()函数来监听表单的提交事件,然后获取表单中的输入值,校验学号和姓名是否为空,年龄是否为数字,如果校验通过,则提交表单。如果校验不通过,则弹出提示框并阻止表单的提交。
(2) 请利用JQuery编写函数实现表单的校验,要求学号和姓名不能为空,年龄必须数字,才能实现表单的提交。 程序清单:(10分) function check() { } 其中表单的html代码如下: <form id=”student” action=”?” method=”post” onsubmit=”return check()”> 学号:<input type=”text” id=”xh”/> 姓名:<input type=”text” id=”name”/> 年龄:<input type=”text” id=”age”/> <input type=”submit” /> </form>
好的,以下是一个使用 jQuery 实现表单校验的函数:
```javascript
function check() {
// 获取表单中的输入值
let xh = $('#xh').val().trim();
let name = $('#name').val().trim();
let age = $('#age').val().trim();
// 校验学号和姓名是否为空
if (xh === '' || name === '') {
alert('学号和姓名不能为空!');
return false;
}
// 校验年龄是否为数字
if (isNaN(age)) {
alert('年龄必须是数字!');
return false;
}
// 表单校验通过,可以提交表单
return true;
}
```
该函数首先使用 jQuery 的 `val()` 方法获取表单中的输入值,并使用 `trim()` 方法去除前后空格。然后,通过判断学号和姓名是否为空,以及年龄是否为数字,进行表单校验。如果校验不通过,使用 `alert()` 方法提示用户并返回 `false` 阻止表单提交;如果校验通过,返回 `true` 允许表单提交。
在 HTML 中,需要在表单元素的 `onsubmit` 属性中调用该函数,例如:
```html
<form id="student" action="?" method="post" onsubmit="return check()">
学号:<input type="text" id="xh"/>
姓名:<input type="text" id="name"/>
年龄:<input type="text" id="age"/>
<input type="submit" />
</form>
```
这样,当用户点击提交按钮时,会自动调用 `check()` 函数进行表单校验。
阅读全文