jQuery实现按钮的点击 全选/反选 单选框/复选框 文本框 表单验证

2020-05-23 06:09:30易采站长站整理

}
alert($("#sel").val());
alert("姓名:"+$("#name").val()+" "+"年龄"+$("#age").val() );
});

});
</script>
</head>

<body>
<!-- 按钮 -->
<input type="button" value="确认" id="but"/><br>

<!-- 文本框 -->
<input type="text" name="text" id="te" /><input type="button" id="btext" value="取值"><br>

<!-- 下拉框 -->
<select id="sel">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<br>

<!-- 单选框 -->
<input type="radio" name="radiobutton" id="uradio1" value="1"> 1
<input type="radio" name="radiobutton" id="uradio2" value="2"> 2
<input type="radio" name="radiobutton" id="uradio3" value="3"> 3
<br>

<!-- 复选框 -->
<input type="checkbox" name="checkbox" value="1"> 1
<input type="checkbox" name="checkbox" value="2"> 2
<input type="checkbox" name="checkbox" value="3"> 3
<input type="checkbox" name="checkbox" value="4"> 4
<input type="button" id="ucheck" value="确定">
<br>

<!-- 复选框的全选和反选 -->
<input type="checkbox" name="checkItems" id="checkItems" value="全选/全不选"/>全选/全不选
<br>
<input type="checkbox" name="items" value="足球"/>足球
<input type="checkbox" name="items" value="篮球"/>篮球
<input type="checkbox" name="items" value="游泳"/>游泳
<input type="checkbox" name="items" value="唱歌"/>唱歌
<br>
<input type="button" name="checkall" id="checkall" value="全选" />
<input type="button" name="checkall" id="checkallNo" value="全不选" />
<input type="button" name="checkall" id="check_revsern" value="反选" />

<!-- 表单验证 -->
<form action="">
姓名:<input type="text" id="name"><span id="nameid" style="color:#f00;">姓名不能为空!</span><br>
年龄:<input type="text" id="age"/><span id="ageid" style="color:#f00;">年龄不能为空!</span> <br>
<input type="button" id="ubu" value="确定" />
</form>
</body>
</html>

菜鸟第一次发布,如有不对还望指出

以上所述就是本文的全部内容了,希望大家能够喜欢。