如何指示需要一组单选按钮[重复]
Posted
技术标签:
【中文标题】如何指示需要一组单选按钮[重复]【英文标题】:How to indicate that a group of radio buttons are required [duplicate] 【发布时间】:2014-01-08 20:30:49 【问题描述】:我了解如何在文本字段中放置一个图标以向用户指示它是必需的,并在 html5 表单中获得提示应填写该字段的提示。
单选按钮和复选框是否有类似的机制?
下面是我正在使用的一组简单的单选按钮。
<!DOCTYPE html>
<polymer-element name='marital-status-form'>
<template>
<style">
#col1 order:1;
#col2 order:2; align-self:flex-start;
#hr order:3;
</style>
<form id='form'
name='form'
on-change='updateModel'>
<section
<label for='marriedRdo' id='marriedLbl' >Married</label>
<label for='divorcedRdo' id='divorcedLbl' >Divorced</label>
<label for='singleRdo' id='singleLbl' >Single</label>
<label for='visitingRdo' id='visitingLbl' >Visiting</label>
</section>
<section >
<input id='marriedRdo'
name='status'
type="radio"
value='Married'
on-click='submit'>
<input id=divorcedRdo name='status' type='radio' value='Divorced'>
<input id='singleRdo' name='status' type="radio" value='Single' >
<input id=visitingRdo name='status' type='radio' value='Visiting'>
</section>
<hr id='hr'>
<delete-dispatch-form id='delete-dispatch-form'></delete-dispatch-form>
<button id='submit-btn'
type='submit'></button>
</form>
</template>
<script type="application/dart">
import 'package:polymer/polymer.dart' show CustomTag, observable, PolymerElement;
import 'dart:html' show Event, Node, InputElement;
@CustomTag( 'marital-status-form')
class MaritalStatusForm extends RooleElement
@observable String choice= '';
MaritalStatusForm.created() : super.created();
void updateModel(Event e, var detail, Node target)
//maritalStatus.status = (e.target as InputElement).value;
//print( encode( maritalStatus ) );
void submit ( Event e, var detail, Node target )
$['form'].onSubmit.listen( ( e )
e.preventDefault();
);
</script>
</polymer-element>
【问题讨论】:
对我来说,这只是一个与 Dart 几乎无关的 HTML5 问题。所以我要更改标签。 【参考方案1】:此问题的一个简单解决方案是默认选择一个单选按钮。这样,用户既可以保持默认设置,也可以选择不同的选项。这实际上“需要”一组单选按钮。
【讨论】:
【参考方案2】:从 html 的角度来看,您可以将 'required' 属性添加到组中的单选输入之一,这将需要选择其中一个选项。
<input id='marriedRdo'
name='status'
type="radio"
value='Married'
on-click='submit'
required="required">
查看这个小提琴的演示:http://jsfiddle.net/lickmydesign/5y4Lv6gc/
【讨论】:
以上是关于如何指示需要一组单选按钮[重复]的主要内容,如果未能解决你的问题,请参考以下文章