用javascript实现:1.会员名加文本框且不能为空2.性别有男女两个选择且必选3.密码加文本框且密码要六位以上4.电子邮件地址加文本框且要有@符号5.年龄加文本框且要在1-120
时间: 2024-02-09 11:08:38 浏览: 59
以下是用 JavaScript 实现的代码:
```html
<form>
<label for="username">会员名:</label>
<input type="text" id="username" required><br>
<label>性别:</label>
<input type="radio" id="male" name="gender" value="male" required>
<label for="male">男</label>
<input type="radio" id="female" name="gender" value="female" required>
<label for="female">女</label><br>
<label for="password">密码:</label>
<input type="password" id="password" minlength="6" required><br>
<label for="email">电子邮件地址:</label>
<input type="email" id="email" required><br>
<label for="age">年龄:</label>
<input type="number" id="age" min="1" max="120" required><br>
<input type="submit" value="提交">
</form>
```
解释:
1. 会员名使用了 `<input type="text">` 元素,并在其上设置了 `required` 属性,表示这个文本框不能为空。
2. 性别使用了两个 `<input type="radio">` 元素,它们的 `name` 属性相同,表示它们是同一组单选按钮。并且都设置了 `required` 属性,表示必须选择其中一个。
3. 密码使用了 `<input type="password">` 元素,并在其上设置了 `minlength` 属性,表示密码长度必须大于等于 6。
4. 电子邮件地址使用了 `<input type="email">` 元素,它会自动检查输入的文本是否符合电子邮件地址的格式,如果不符合就会提示错误。
5. 年龄使用了 `<input type="number">` 元素,并在其上设置了 `min` 和 `max` 属性,表示年龄必须在 1 到 120 之间。并且也设置了 `required` 属性,表示这个文本框不能为空。
最后,使用了 `<input type="submit">` 元素作为提交按钮。用户点击提交按钮后,浏览器会自动检查表单是否符合要求,如果符合就会提交表单。你可以在提交表单的处理程序中获取用户输入的值,并进行相应的处理。
阅读全文