admin管理员组文章数量:1323214
Below is my code:
<form>
<div class="form-group loginFormGrp">
<label class="caption">Backup Cloud</label>
<div class="custSelect loginSelect">
<label class="caption">Server URL</label>
<input type="text" aria-label="Server URL" name="serverUrl" class="form-control" placeholder="example.server" value="">
</div>
<div class="form-group loginFormGrp">
<label class="caption">Email</label>
<input type="text" aria-label="Email" name="email" class="form-control" placeholder="[email protected]" value="">
</div>
<div class="loginBtnRow">
<button tabindex="0" type="submit" class="lgBtn btn btn-primary btn-block">Continue</button>
</div>
</div>
</form>
whenever voiceover highlights the input text field it reads "You are currently on text field, inside web content. To enter text in this filed, type. To exit web area,.." and when I Start typing it says nothing. and checked other appilcation or websites it reads what i am typing. but in my case its not reading. Please help if anyone knows the solution.
Below is my code:
<form>
<div class="form-group loginFormGrp">
<label class="caption">Backup Cloud</label>
<div class="custSelect loginSelect">
<label class="caption">Server URL</label>
<input type="text" aria-label="Server URL" name="serverUrl" class="form-control" placeholder="example.server." value="">
</div>
<div class="form-group loginFormGrp">
<label class="caption">Email</label>
<input type="text" aria-label="Email" name="email" class="form-control" placeholder="[email protected]" value="">
</div>
<div class="loginBtnRow">
<button tabindex="0" type="submit" class="lgBtn btn btn-primary btn-block">Continue</button>
</div>
</div>
</form>
whenever voiceover highlights the input text field it reads "You are currently on text field, inside web content. To enter text in this filed, type. To exit web area,.." and when I Start typing it says nothing. and checked other appilcation or websites it reads what i am typing. but in my case its not reading. Please help if anyone knows the solution.
Share Improve this question edited Jun 3, 2018 at 11:54 Mostafa Norzade 1,7765 gold badges27 silver badges41 bronze badges asked May 21, 2018 at 9:14 pareshmpareshm 4,9845 gold badges36 silver badges54 bronze badges 2- What browsers are you using? Also does the HTML change when rendered? Is there any validations happening on fields (like jQuery Validation)? Using plain html you provider it works in latest Safari and Chrome. Firefox does not, but it seems to be a Firefox issue. – thekodester Commented Jun 2, 2018 at 17:38
- As you mentioned it is an electron APP can i know the operating system you getting this issue. – karthik Commented Jun 3, 2018 at 1:55
3 Answers
Reset to default 3Add title
attribute to the input element and provide additional text.
Adding aria-label
to the input elements should also be picked by the screen readers.
http://pauljadam./demos/title-aria-label.html provides details on how different browsers and screen readers treat these attributes.
Your code seems pretty fine. I tried with a chrome plugin called ChromeVox everything seems to be fine except that add the lang attribute to the parent html tag and enclose everything in a body tag some thing like this.
<html lang="en-US" style="height: 100%;">
<body>
<form>
<div class="form-group loginFormGrp">
<label class="caption">Backup Cloud</label>
<div class="custSelect loginSelect">
<label class="caption">Server URL</label>
<input type="text" aria-label="Server URL" name="serverUrl" class="form-control" placeholder="example.server." value="">
</div>
<div class="form-group loginFormGrp">
<label class="caption">Email</label>
<input type="text" aria-label="Email" name="email" class="form-control" placeholder="[email protected]" value="">
</div>
<div class="loginBtnRow">
<button tabindex="0" type="submit" class="lgBtn btn btn-primary btn-block">Continue</button>
</div>
</div>
</form>
</body>
</html>
I'm not sure if this'll help, but You may try to update fields value
attribute, every time user modify text field. Something like that:
document.querySelectorAll('input[type="text"]').forEach(function(v){
v.addEventListener('input', function(){
v.setAttribute('value', v.value);
});
});
But I wish someone provide better answer, without using extra JavaScript.
本文标签: javascriptVoice over is not reading what I am typing in textboxStack Overflow
版权声明:本文标题:javascript - Voice over is not reading what I am typing in textbox - Stack Overflow 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1742118067a2421562.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论