Question

我的下载待处理订单按钮在ios平板电脑上无法正常工作。如何仅在ios平板电脑上隐藏此按钮？目前，我如何为任何平板电脑设置其皮革。

我已经在html中创建了一个id并执行了display：none;在我的CSS中。

HTML

<div id="hide-download">
  <app-button name="download"
              classAttr="btn-primary"
              (click)="downloadFile()"
              [disabled]="!allOrders || allOrders.length === 0">
    <i class="fas fa-download button-icon-padding"></i>
    Download
  </app-button>
  <a class="hidden" #download></a>
</div>

Css

@media screen and (max-width: 768px) {
  #hide-download {
    display:none;
  }
}

我希望仅对iOS平板电脑隐藏（纵向模式和横向模式）。但是，对于横向模式下的所有平板电脑设备，它都会隐藏。

Answer 1

您可以使用JavaScript进行此操作：

if (navigator.userAgent.match(/(iPad)/)) {
    document.getElementById("hide-download").style.display = "none";
} else {
    document.getElementById("hide-download").style.display = "initial";//or whatever it is supposed to be
}

这也适用于其他设备。只需更改if语句：

if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) {
    document.getElementById("hide-download").style.display = "none";
} else {
    document.getElementById("hide-download").style.display = "initial";
}

Answer 2

您可以像这样检查用户代理是否为PHP的iPad，然后为您的按钮生成html。这样，按钮不会显示在iOS设备上。

$iPod    = stripos($_SERVER['HTTP_USER_AGENT'],"iPod");
$iPhone  = stripos($_SERVER['HTTP_USER_AGENT'],"iPhone");
$iPad    = stripos($_SERVER['HTTP_USER_AGENT'],"iPad");

if( $iPod || $iPhone || $iPad ){
    echo '<div id="hide-download">
          <app-button name="download"
              classAttr="btn-primary"
              (click)="downloadFile()"
              [disabled]="!allOrders || allOrders.length === 0">
          <i class="fas fa-download button-icon-padding"></i> Download
          </app-button>
          <a class="hidden" #download></a>
          </div>';

        }else{
            echo 'No button here ;-)';
        }

仅适用于iOS平板电脑的“隐藏下载”按钮纵向和横向模式

2 个答案: