Question

我的网站上有一个计算表格，其中包含3个字段。

在PC上查看表单时，字段的正确水平顺序为3,2,1（RTL格式）

但是，如果我在移动设备上查看页面，则字段会垂直显示，这很好。但顺序是倒退的：

3
2
1

如何根据页面宽度使用JS更改订单？

Answer 1

HTML：

var ua = navigator.userAgent.toLowerCase();
var isAndroid = ua.indexOf("android") > -1;
if(isAndroid) {
  // SHOW YOUR DIV
}

JS：

<body>
    <div id='parent'>
      <div order="1">A</div>
      <div order="2">B</div>
      <div order="3">C</div>
    </div>
</body>

您可以调整窗口大小并运行脚本

如果宽度< 480，订单将反转

Answer 2

我设法使用CSS解决了这个问题：

    @media (max-width: 480px) 
{
    .row
    {
      display: flex;
      flex-direction: column-reverse;
  }