我有一个fieldset和一个类型为range的input（从1到10），以及当输入值为5时显示的隐藏文本。在Chrome中，当鼠标经过值5时，滑块卡住。然而，在Firefox中，这个问题不会发生，输入工作正常。我尝试过用div元素替换fieldset，这解决了Chrome中的问题，但我更愿意保留fieldset元素以便于访问。有没有其他方法可以让这个特定的fieldset在Chrome中像在Firefox中一样工作？
<fieldset>
<input type="range" id="inputRange" min=1 max=10 value=1>
<p id="text" hidden>Hey!</p>
</fieldset>
<script>
const range = document.getElementById('inputRange');
const text = document.getElementById('text');
range.addEventListener('input', () => text.hidden = range.value != 5);
</script>
1条答案
按热度按时间xqkwcwgp1#
正如我在评论中提到的，如果您编辑p元素的内容并且不更改可见性状态，它可以正常工作。
另外，为了使它看起来像一个完全隐藏的p元素，请在它为空时删除它的边距。