jQuery之总结val方法选中单选、复选和下拉列表

最新推荐文章于 2024-06-16 09:35:37 发布

中单亚索不给就送

最新推荐文章于 2024-06-16 09:35:37 发布

阅读量334

点赞数 1

文章标签： jQuery val方法

本文链接：https://blog.csdn.net/qq_44829555/article/details/90716834

版权

一、jquery实现单选框并选中要求的value项：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="js/jquery-1.8.3.js" ></script>
	</head>
	<body>
		<input type="radio" name="sex" value="0"/>雪浪红尘
		<input type="radio" name="sex" value="1"/>碧海红潮
		
		<script>
			$("[name='sex']").val(["1"]);
		</script>
	</body>
</html>

执行结果
在这里插入图片描述
二、jQuery实现复选框

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="js/jquery-1.8.3.js" ></script>
	</head>
	<body>
		<input type="checkbox" name="hobby" value="0"/>雪浪红尘
		<input type="checkbox" name="hobby" value="1"/>碧浪红尘
		<input type="checkbox" name="hobby" value="2"/>千寻一醉
		
		<script>
			$("[name='hobby']").val(["0","1"]);
		</script>
	</body>
</html>

执行结果
在这里插入图片描述
三、jquery实现select下拉框

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="js/jquery-1.8.3.js" ></script>
	</head>
	<body>
		<select>
			<option>--江山如画--</option>
			<option value="1">雪浪红尘</option>
			<option value="2">千寻一醉</option>
			<option value="3">碧海红潮</option>
		</select>
		
		<script>
			$("select").val(["1"]);
		</script>
	</body>
</html>

执行结果：默认选中value=1的选项
在这里插入图片描述
本文中主要是总结val方法，其他方法一样适用，可能会在后续文章中给出总结