Roy*_*ron 9 jquery html5 google-chrome right-to-left
在过去的几个月里,我目睹了一个奇怪的现象,Chrome加载了一个网页,直到我开始滚动才显示任何内容.起初我认为这是网站的一个问题,然后是最新版Chrome的一个小故障,但现在我认为它与jquery和rtl之间的一些冲突有关.以下示例显示空白页面,直到我开始滚动:
<!doctype html>
<html dir="rtl">
<body>
<h1>Blank screen test</h1>
<div style="padding: 50%; background-color: orange;">Hey</div>
<script src="https://code.jquery.com/jquery-1.11.1.js"></script>
</body>
</html>
这并不总是发生,但它在我的机器上非常一致(例如,约70%的刷新).确保开发人员工具已关闭 - 出于某种原因,它们在打开时不会发生.
删除dir="rtl"可以防止这种情况发生.
删除<script src="https://code.jquery.com/jquery-1.11.1.js"></script>也可以防止这种情况发生.
不知道该怎么做.有没有人看到这种情况发生？任何想法如何解决这个问题？
(顺便说一句,我在Mac OS 10.12.5上使用的是Chrome 58.0.3029.110(64位))
当涉及到内容呈现时，该属性dir可以被 CSS 覆盖：direction: rtl;
由于文本的方向性在语义上是相关的，我建议您dir='rtl'在加载 jQuery 时添加 Javascript。这样，dir在页面加载时就不会干扰 jQuery。
<html>
<body>
<h1>Blank screen test</h1>
<div style="padding: 50%; background-color: orange;">Hey</div>
<script src="https://code.jquery.com/jquery-1.11.1.js"></script>
<script type="text/javascript">
$(document).ready(function() { $('html').attr('dir', 'rtl'); });
</script>
</body>
</html>