前端设置单选框禁用
时间: 2023-08-24 10:05:08 浏览: 45
要禁用一个单选框,可以在该单选框的input元素上设置disabled属性。例如:
```html
<label>
<input type="radio" name="gender" value="male" disabled>
Male
</label>
<label>
<input type="radio" name="gender" value="female">
Female
</label>
```
在上面的示例中,第一个单选框被禁用了,并且不能被选中。第二个单选框没有被禁用,可以被选中。
相关问题
前端单选框怎么写
前端单选框可以使用`<input>`标签来实现。可以使用`type="radio"`来指定为单选框,同时设置`name`属性来保证同一组单选框只能选中一个选项。例如:
```html
<label for="option1">选项1</label>
<input type="radio" id="option1" name="options">
<label for="option2">选项2</label>
<input type="radio" id="option2" name="options">
<label for="option3">选项3</label>
<input type="radio" id="option3" name="options">
```
在上面的例子中,`name="options"`表示这三个单选框是同一组,只能选中其中一个选项。`id`和`for`属性用于关联标签和单选框。用户可以通过点击标签或者单选框来选中对应的选项。
uniapp设置单选框
在uniapp中设置单选框可以使用`<radio>`标签,示例代码如下:
```html
<template>
<view>
<radio-group v-model="selected">
<radio value="apple">苹果</radio>
<radio value="banana">香蕉</radio>
<radio value="orange">橙子</radio>
</radio-group>
</view>
</template>
<script>
export default {
data() {
return {
selected: 'apple' // 默认选中的值
}
}
}
</script>
```
在上面的示例中,`<radio>`标签用于设置单选项,`<radio-group>`标签用于将多个单选项组合在一起,并且通过`v-model`绑定一个变量,用于获取用户选择的值。其中,`value`属性用于设置每个单选项的值,当选中某个单选项时,`v-model`绑定的变量的值就会被更新为该单选项的`value`值。