web复选框的基础用法

最新推荐文章于 2021-12-05 19:49:45 发布

Revival_Liang

最新推荐文章于 2021-12-05 19:49:45 发布

阅读量3.4k

点赞数

分类专栏： web

本文链接：https://blog.csdn.net/Revival_Liang/article/details/58598446

版权

web 专栏收录该内容

75 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="js/jquery-1.12.0.min.js" ></script>
		<style type="text/css">
		.box{
			width: 300px;
			height: 300px;
			background: yellow;
		}
		</style>
		<script type="text/javascript">
			$(document).ready(function(){
				$("#button").click(function(){
					//获得复选框的选择状态
					var value = $("#key1").is(":checked");
					if(value){
						//把选择值改为true
						$("#key2").attr("checked",true);
					}else{
						//把选择值改为false
						$("#key2").attr("checked",false);
					}
					//使用post方法上传
					$.post(url,{key1:value},function(data,status){
						//data返回的数据，status请求状态
						
					});
					//把结果打印出来
					console.log(value);
				});
			});
		</script>
	</head>
	<body>
		<div class="box">
			<form action="http://127.0.0.1:8020/TestProject/test1.html" method="post">
				<input type="checkbox" name="key1" value="yes" id="key1"/>
				<input type="checkbox" name="key1" value="yes" id="key2"/>
				<input type="button" id="button" value="Click"/>
			</form>
		</div>
	</body>
</html>

Revival_Liang

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
web复选框的基础用法

.box{ width: 300px; height: 300px; background: yellow; } $(document).ready(function(){ $("#button").click(function(){ //获得复选框的选择状态 var value = $("#key1").is(":checked
复制链接

扫一扫

专栏目录