<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>表单</title>
</head>
<body>
<!-- 表单元素 -->
<!-- action是提交到服务器接口地址 -->
<form action="test.html" method="get/post">
<!-- 表单元素 input -->
<!-- 明文输入框 -->
用户名:<input type="text" name="account" placeholder="请输入用户名">
<br>
<!-- 暗文输入框 -->
密码:<input type="password" name="pwd" placeholder="请输入密码"><br>
<!-- 单选按钮 -->
性别:
<br>
<!-- 单选框默认情况不会出现互斥 如果想要出现互斥 给name一个相同的属性值 -->
<!-- value表示真正提交给后台的值 -->
<label for="man">
男:<input id="man" type="radio" name="gender" value="male">
</label>
女:<input type="radio" name="gender" value="female">
<br>
<!-- 提交按钮-->
<!-- 多选框 -->
<!-- 水果 -->
<br>
水果:
香蕉<input type="checkbox" name="fruit" value="banana">
苹果<input type="checkbox" name="fruit" value="apple">
橘子<input type="checkbox" name="fruit" value="orange">
<!-- 文件上传 -->
<!-- 附件上传 -->
<input type="file" name="文件上传" >
<!-- 普通按钮 配合js完成一些操作-->
<input type="button" value="普通按钮" id="btn">
<!-- 重置按钮 -->
<!-- 重置按钮可以清空表单中填写的表单元素的值 -->
<input type="reset" value="重置按钮">
<!-- 隐藏域 -->
<!-- 悄悄地默默的提交给服务器一些数据 -->
<input type="hidden" name="token" value="wedfwiuehru23e234234981561616516">
<input type="submit" value="提交">
</form>
</body>
<script>
// js的点击事件--event事件对象本身 形参
btn.οnclick=function(event){
// 打印一下事件对象本身
console.log(event);
event.value='普通按钮1'
}
</script>
</html>
1880
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
