如何解决 Firefox 的 material 设计输入字段占位符屏幕 reader 问题？
How to solve material design input field placeholder screen reader issue with Firefox?
我正在为输入字段使用带有浮动标签的 material 设计。
有一些场景使用占位符文本来向用户宣布额外的细节。对于 inactive/blurred 文本字段我无法添加占位符（标签和占位符文本将相互重叠）所以我在输入字段焦点 in/out.
上切换占位符文本
它与 Chrome 在 JAWS 中运行良好，宣布：<label> <placeholdertext>
但是对于 Firefox，它只宣布 <label> 并且由于是动态添加而遗漏了占位符。
对于这种情况有什么解决办法吗？
我假设如果没有修复，我可能需要添加占位符文本和标签，将来可能会出现间距问题。
此问题已通过切换 title 和 placeholder 属性得到解决。现在两个浏览器（FF 和 chrome）上的屏幕 reader 宣布 <label> + <title> 和 placeholder 属性被忽略。这解决了 FF 浏览器上占位符问题的可访问性问题。
(或)
aria-describedby 属性被添加到输入字段并赋值作为同一输入字段的id-value。所以这样屏幕 reader 宣布 <aria-describedby> + placeholder，并且 aria-describedby 间接指向标签值，因为输入标签的 id-attr 指向标签的 for-attr。这在 chrome 和 FF
中类似
我正在为输入字段使用带有浮动标签的 material 设计。 有一些场景使用占位符文本来向用户宣布额外的细节。对于 inactive/blurred 文本字段我无法添加占位符（标签和占位符文本将相互重叠）所以我在输入字段焦点 in/out.
上切换占位符文本它与 Chrome 在 JAWS 中运行良好，宣布：<label> <placeholdertext>
但是对于 Firefox，它只宣布 <label> 并且由于是动态添加而遗漏了占位符。
对于这种情况有什么解决办法吗？
我假设如果没有修复，我可能需要添加占位符文本和标签，将来可能会出现间距问题。
此问题已通过切换 title 和 placeholder 属性得到解决。现在两个浏览器（FF 和 chrome）上的屏幕 reader 宣布 <label> + <title> 和 placeholder 属性被忽略。这解决了 FF 浏览器上占位符问题的可访问性问题。
(或)
aria-describedby 属性被添加到输入字段并赋值作为同一输入字段的id-value。所以这样屏幕 reader 宣布 <aria-describedby> + placeholder，并且 aria-describedby 间接指向标签值，因为输入标签的 id-attr 指向标签的 for-attr。这在 chrome 和 FF