Question

我在输入框中使用text-transform：uppercase。它不支持平板电脑浏览器。

这是我的HTML：

<html>
<body>
<input type="text" class="isCapital">
</body>
</html>

和CSS：

.isCapital{text-transform:uppercase;}

任何人都有解决方案。请更新你的答案。

Answer 1

你有：

                          <!-- v--- this was misspelled -->
<input type="text" class="isCaptial">

应该是：

<input type="text" class="isCapital" />

Answer 2

你拼错了资本。

将isCaptial替换为isCapital。

Answer 3

您不应期望text-transform影响表单字段值，因为此类值不是HTML元素内容的一部分。在我测试的浏览器（Firefox，Chrome，IE，Opera on Win和Android）中看到它实际上影响了值，无论是在value属性中指定还是由用户输入，我都感到惊讶。但是CSS规范中没有规定这种行为。

以这种方式转换数据也可能令人困惑和误导。用户键入“foo”但看到“FOO”，表单提交上实际发送的数据为“foo”。

如果你真的希望让页面表现那样，那么大多数跨浏览器的方式可能是使用（除了text-transform属性之外）JavaScript代码，它们在输入时将字符转换为大写但也存储了原始输入并截取表单提交，以便不是实际的表单，而是由JavaScript代码创建的另一个表单，作为原始表单的隐形副本，但输入的数据如此存储，将被提交。

Answer 4

我怀疑它可以帮助与否，但你想尝试一下吗？使用Javascript / jQuery：

<script>
jQuery(function(){
  jQuery(".isCapital").html().toUpperCase();
});
</script>

快乐的编码！

平板电脑浏览器不支持text-transform css

4 个答案: