ASP.NET MVC的Checkbox实现可访问/屏幕阅读器友好吗?

时间:2017-06-07 19:53:29

标签: asp.net-mvc accessibility

如果您曾经查看过使用 @ Html.CheckBoxFor 时ASP.NET MVC实际渲染的内容,那么您已经看到要求渲染的每个复选框实际上都会导致发射不是一个而是两个 输入标签。一个是“true”值复选框,另一个是“false”。后一种输入是“隐藏”类型。

通常,如果您正确使用ASP.NET MVC,这不会导致问题。您不会注意到输入加倍,除非您尝试直接使用 Request.Form 执行某些操作(例如Why does ASP.NET MVC Html.CheckBox output two INPUTs with the same name?

我的问题是,屏幕阅读器如何处理这个问题。例如,是否可以依赖它们才能正确报告网站用户的可见复选框?

2 个答案:

答案 0 :(得分:2)

屏幕阅读器将忽略隐藏的输入。

答案 1 :(得分:1)

根据您在评论中引用的示例,它会返回以下代码:

<div class="col pure-u-xl-1-3 pure-u-lg-1-3 pure-u-md-1 pure-u-sm-1 pure-u-xs-1">
  <label>Home Club Newsletter</label>
  <input checked="checked" … id="newsletter" name="JoinHomeClub" type="checkbox" value="true">
  <input name="JoinHomeClub" type="hidden" value="false">
  <span class="checkbox-label">Yes, please sign me Up!</span>
</div>

这里有一个问题,因为<label>与控件无关,而复选框旁边的可见文本与该字段无关。

当我访问NVDA中的字段时,所有内容都是“复选框选中”。根本没有可访问的名称。

但是你的问题......

您的问题与<input type="hidden">有关。正如@SLaks所说,屏幕阅读器会忽略<input type="hidden">。它们具有相同name值的事实没有问题。如果它们具有相同的id值,那么您将遇到问题(它在屏幕阅读器中的显示方式取决于事物和内容)。