css 禁用按钮在平板电脑上不起作用

css disable button not working in tablets

-我有一个按钮: -我想用 javascript 禁用它: document.getElementById("input-datestart").disabled = true; -Css:

input:disabled {
    background-color: #fff!important;
    color: #000;
}

文字颜色[颜色:#000;] 在我电脑的浏览器上它可以工作,但在平板电脑上,它不工作, 请在图片下方找到 enter image description here

请尝试使用 webkit 前缀和 CSS 属性,我希望它适用于 Android 平台

您可以将其用于多个 OS。

Make the background and text visible to screen what I observe in your fiddle is it transparent for the users, so feel free to modify a color code to make it consistent across devices and platforms.

document.getElementById("input-datestart").disabled = true;
  input:disabled {
  -webkit-text-fill-color: #880000;
  /* Override iOS / Android font color change */
  -webkit-opacity: 1;
  /* Override iOS opacity change affecting text & background color */
  color: #880000;
  /* Override IE font color change */
<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>

  <input value="text value" name="datePlan" id="input-datestart" readonly="" type="text">

</body>

</html>