Question

我在HTML中创建了一个表，并为每个数字输入字段设置了最小和最大范围。当我在最新版本的Chrome和Firefox中运行演示时，我会看到最小的增量和减少箭头到最右边。但是，当我在IE中运行相同的应用程序时，up＆amp;向下箭头不显示。

我的问题是：有没有办法让它在IE中展示，或者，目前还没有支持吗？

提前致谢。

＆＃13;

body {
    font-family: 'Segoe UI', sans-serif;
}

span {
    font-style: italic;
}

＆＃13;

<!DOCTYPE html>

<html lang="en">

<head>
  <meta charset="utf-8" />
  <title>My first input test</title>
  <link rel="stylesheet" href="app.css" type="text/css" />
</head>

<body>
  <h1>Hello World!</h1>
  <table class="table table-striped table-hover table-bordered" id="PatientTrackingBoardTable" border="1">
    <thead>
      <tr>
        <th class="TopRow">Inventory</th>
        <th class="TopRow">Qty</th>
      </tr>
    </thead>

    <tr class="SubRow">
      <td class="InventoryRow" style="width:75%">Chairs</td>
      <td class="QtyAvailableCell">
        <input id="ChairsAvailable" type="number" class="BedInputField" min="0" max="100" />
      </td>
    </tr>
    <tr class="SubRow">
      <td class="InventoryRow">Tables</td>
      <td class="QtyAvailableCell">
        <input id="TablesAvailable" type="number" class="BedInputField" min="0" max="100" />
      </td>
    </tr>
  </table>
</body>

</html>

＆＃13;

Answer 1

IE 10和11都允许输入类型：数字-但是您没有UI旋转按钮。

Answer 2

您需要使用JavaScript或jQuery在IE中进行此类更改。

$(function () {
  $("input").keydown(function () {
    if (!$(this).val() || (parseInt($(this).val()) <= 11 && parseInt($(this).val()) >= 0))
    $(this).data("old", $(this).val());
  });
  $("input").keyup(function () {
    if (!$(this).val() || (parseInt($(this).val()) <= 11 && parseInt($(this).val()) >= 0))
      ;
    else
      $(this).val($(this).data("old"));
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="number" min="0" max="11" value="0"/>

希望这会有所帮助。

HTML输入类型编号min＆amp;最大属性在IE中不起作用

2 个答案: