表单行不再用 label 包 button 型控件
没有 for 的 label 会绑定内部第一个可关联控件。导入 ini 的「内容」行里 那是 DropFile 的按钮:悬停 textarea 会点亮投放区,点到行内空白处直接 弹出文件选择框。SelectBox 的开关按钮同理(InboundForm、RuleGroupForm、 ini 映射行),悬停整行都会点亮它。这些行改用 div,无障碍名换成控件 自己的 aria-label。ComboBox 的行保持 label——它第一个可关联控件是文本 输入框,label 转发过去正是想要的行为。
This commit is contained in:
@@ -158,28 +158,31 @@ function onBackdrop(event: MouseEvent) {
|
||||
</span>
|
||||
</label>
|
||||
|
||||
<label class="row">
|
||||
<!-- SelectBox 的行不用 label 包:没有 for 的 label 绑定第一个可关联控件,
|
||||
正好是它的开关按钮,悬停行内任何位置都会点亮它、点空白处会展开面板 -->
|
||||
<div class="row">
|
||||
<span class="k">行为</span>
|
||||
<span class="v">
|
||||
<SelectBox v-model="behavior" :options="BEHAVIOR_OPTIONS" />
|
||||
<SelectBox v-model="behavior" :options="BEHAVIOR_OPTIONS" aria-label="行为" />
|
||||
<span class="note">
|
||||
清单每行带 DOMAIN,、IP-CIDR, 这类前缀的是 classical;纯域名列表是 domain;
|
||||
纯 IP 网段列表是 ipcidr
|
||||
</span>
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<label class="row">
|
||||
<div class="row">
|
||||
<span class="k">格式</span>
|
||||
<span class="v">
|
||||
<SelectBox
|
||||
v-model="format"
|
||||
:options="FORMAT_OPTIONS"
|
||||
aria-label="格式"
|
||||
@update:model-value="formatTouched = true"
|
||||
/>
|
||||
<span v-if="mrsConflict" class="bad">mrs 格式只支持 domain 和 ipcidr 两种行为</span>
|
||||
</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="divide" role="presentation"><span>或从文件导入</span></div>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user