开发者学堂课程【零基础学前端 HTML+CSS :单选】学习笔记,与课程紧密联系,让用户快速学习知识。
课程地址:https://developer.aliyun.com/learning/course/398/detail/5119
单选
内容介绍:
一、单选框
二、示例
一、单选框
单选框一次只能一个选项。
用 <input> 标签描述。单选框使用时至少需要2个以上的 input 标签,并且它们 name 属性相同,其中每一个 input 构成一个选项。
二、示例
在上节 from.html 中继续输入
<tr>
<td>
<input name= “d1” type= “radio”>
</td>
</tr>
假如 <input> 前写兴趣选择:篮球
兴趣选择:篮球<input name= “d1” type= “radio”>
运行结果如图:
可以选择,但是我们需要知道单选框复选框都不是用户直接输入的,都是直接进行选择的,那么选择完后我们把什么东西提交出去呢?
这种写在页面上的文字是提交不出去的,它是不具有上传的特性的,要想提交出去,必须还有一个 value 属性
总结:
单选框:<input> 标签,type= “radio” value =值,所以用户提交出去的是 value 里的值,而不是在页面上写的文字
比如说选择篮球,我们用数值0来表示
兴趣选择:篮球<input name= “d1” type= “radio” value= “0”>
那么在页面上提交出去的是数值0,而并不是把篮球这两个字提交出去
另外文本框也可以有这种属性,比如
<input name= “user_name” type= “text” value= “默认”>
默认两个字就是文本框的默认值
接下来继续写入兴趣选择,一定要注意值肯定不一样,要根据实际情况定,名称一定要一样,比如下列都为 d1
兴趣选择:
篮球<input name= “d1” type= “radio” value= “0”>
足球<input name= “d1” type= “radio” value= “1”>
网球<input name= “d1” type= “radio” value= “2”>
运行如图,三选一
但如果 name 名称不为同一个,将网球<input name= “d1” type= “radio” value= “2”>
改为网球<input name= “d2” type= “radio” value= “2”>
则会变成两个单独的单选框,足球篮球二选一,网球单独可选