百分百源码网-让建站变得如此简单! 登录 注册 签到领金币!

主页 | 如何升级VIP | TAG标签

当前位置: 主页>网站教程>html5教程> html怎样实现表单的选中框结果?单选框与多选框的实现(代码实例
分享文章到:

html怎样实现表单的选中框结果?单选框与多选框的实现(代码实例

发布时间:09/01 来源:未知 浏览: 关键词:
在使用表单提交数据的时候,为了减少会员的一些操纵,使用选中框是一个好主意。本章给大家介绍html怎样实现表单的选中框结果?单选框与复选框的实现(代码实例)。通过单选框代码和复选框代码实例,实现单选框样式和多选框样式,有必然的参照 价值,有需要的伴侣可以参照 一下,但愿对你有所帮忙。

一、选中框品种与语法

html中有两种选中框,即单选框和复选框,两者的不同是单选框中的选项会员只能选中一项,而复选框中会员可以任意选中多项,乃至全选。

语法:

<input   type="radio/checkbox"   value="值"    name="名称"   checked="checked"/>

二、html单选框样式

html单选框代码:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>单选框</title>
	</head>
	<body>
		<form name="form" method="post" action="">
		              你可否喜爱运动?<br />
		     <input type="radio" name="radio" value="喜爱"/>喜爱
		     <input type="radio" name="radio" value="不喜爱"/>不喜爱
		     <input type="radio" name="radio" value="无所谓"/>无所谓
		</form>
	</body>
</html>

结果图:

1.jpg

从上例可以看出:

当type="radio"时,选中框定义为单选框;

name属性: 定义单选按钮的名称,单选按钮都是以组为单位使用的,在统一组中的单选项都必需用统一个名称;

value属性: 定义单选按钮的值,在统一组中域值必需是不一样。

当设定 checked="checked" 时,该选项被默许选中,不管单选框还是复选框都可使用,如在单选框中:

2.jpg

三、html复选框样式

复选框主如果让网页阅读者在一组选项里可以同时选中多个选项。每个复选框都是一个独立的元素,都必需有独一的一个名称。

html复选框代码 :

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>复选框</title>
	</head>
	<body>
		<form name="form" method="post" action="">
		              你喜爱什么运动?<br />
		     <input type="checkbox" name="checkbox" value="跑步" checked="checked"/>跑步
		     <input type="checkbox" name="checkbox" value="羽毛球"/>羽毛球
		     <input type="checkbox" name="checkbox" value="乒乓球"/>乒乓球
		     <input type="checkbox" name="checkbox" value="乒乓球"/>爬山
		</form>
	</body>
</html>

结果图:

3.jpg

从上例可以看出:

当type="checkbox"时,选中框定义为复选框;

name属性: 定义复选框的名称,在统一组中的复选框使用不一样的名称,但也可以定义为统一个名称(数组),例:name[];

value属性:定义复选框的值,在统一组中域值必需是不一样。

四、选中框的name属性

在HTML表单中,不管是一组单选按钮(radio)还是一组复选框(checkbox)其中都要包括着name属性。这是为了利便在处置页面猎取表单传递的值。

一组单选按钮(radio):由于name属性里的值是雷同,所以只要一个能被选中,在处置页面就直接猎取,如$_GET['name'];

一组复选框(checkbox):一样将name属性里的值设定为name[],假如被选中,则在数组name[]中增加一个元素,在处置页面将如下猎取值:

if(!empty($_POST['name'])){
for($i=0; $i< count($_POST['name']); $i++){
echo $array[$i].'<br />';
}
}

这样就可以收集到表单复选框(checkbox)里传递来的多个不一样数据。

以上就是html怎样实现表单的选中框结果?单选框与多选框的实现(代码实例)的具体内容,更多请关注百分百源码网其它相关文章!

打赏

打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,你说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

百分百源码网 建议打赏1~10元,土豪随意,感谢您的阅读!

共有152人阅读,期待你的评论!发表评论
昵称: 网址: 验证码: 点击我更换图片
最新评论

本文标签

广告赞助

能出一分力是一分吧!

订阅获得更多模板

本文标签

广告赞助

订阅获得更多模板