NVDA + Firefox無法正確讀取內容

Question

所以我有這段代碼：

<div style="top: 143.4px; left: 345.85px; display: block;" class="w size-200" tabindex="1" id="sitetour-wrapper">
    <span id="sitetour-pointer"></span>
    <div class="content-wrapper">
        <span id="sitetour-header" class="sitetour-header">Test Text</span>
        <div id="sitetour-content">
            Why this is not being read 
            <div id="demo-bb" class="demo-bg">
                    <div></div>
            </div>
        </div>
    </div>
    <div id="sitetour-footer">
        <button style="display: block;" type="button" title="back" id="sitetour-back-btn" class="back-btn btn-link">Back</button>
        <button style="display: none;" type="button" title="next" id="sitetour-next-btn" class="submit-btn">Next</button>
        <button type="button" title="close" class="btn-link cancel-btn" id="sitetour-close-btn">Close</button>
    </div>
</div>

我想要它，以便當我專注於＃sitetour-header時，屏幕閱讀器將相應地讀取文本的內容....但是使用NVDA + Firefox時，此代碼無法正確讀取...我該怎么辦錯誤？

Answer 1

我試圖在codepen，jsfiddle中使用靜態html來重現此問題，而所有三個都在使用firefox和NVDA讀取文本。 如果未讀取文本，則可能是由於頁面其他方面的干擾所致。 如果您能夠說出它的閱讀方式不正確，那也可以幫助您了解發生了什么。