Javascript 输入百分比值

我在我的webapp上有一些输入，我们要求用户输入百分比值（例如10.75%，23%）。目前，他们必须以十进制形式输入这些值（例如0.1075、0.23）

这给一些用户带来了困惑，所以我希望有一种方法可以将这些值转换成这些格式（后端有十进制值，HTML输入显示百分比值）。有没有解决这个问题的方法，而不必使用javascript之类的工具

我在HTML5输入中没有看到任何可以做到这一点的东西，我也没有找到一个javascript库可以轻松做到这一点

其他人用什么方法在HTML中进行百分比输入

---

其他信息

webapp使用的是Java/Spring，因此HTML页面中的值来自所讨论的Java对象的字符串，因此理想情况下，我正在寻找不需要任何后端编码的东西

---

回答

事实证明，Spring3.0将自动完成这项工作。用以下内容注释相关字段：

@NumberFormat(style = NumberFormat.Style.PERCENT)
private BigDecimal rate;

---

将完成与输入字段之间的所有转换。

这是一个简单的数学。。。75到0.75是75/100。包括一行代码，用于在提交数字后转换数字。

所需的javascript非常简单。例如，您可以在用户提交时将用户输入的分数值存储在隐藏字段中

​<form id="myForm">
    <input type="text" id="myPercent" name="myPercent" />%
    <input type="hidden" id="myFraction" name="myFraction" />
    <input type="submit" />
</form>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
<script type="text/javascript">
    document.getElementById('myForm').onsubmit = function() {
        document.getElementById('myFraction').value = 
            document.getElementById('myPercent').value / 100;
    }
</script>

​
%
​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​
document.getElementById（'myForm'）。onsubmit=function（）{
document.getElementById（'myFraction'）。值=
document.getElementById（'myPercent'）。值/100；
}

理想情况下，我希望在一个输入框中完成所有操作（不使用隐藏字段）。如果在失去字段焦点后10.75%变为0.1075，用户可能会有点困惑。你不能在提交时这样做吗？在输入框后显示一个“%”字符，他们键入75，然后在提交表单时除以100？我真的不理解你的问题。让他们输入75。当他们提交时，你在代码中将其除以100…如果你想返回一个百分比值，只需将其乘以100，然后返回。也许你需要给我们一些关于你的网络应用如何工作的更多信息。我已经在问题中添加了一些额外的信息。这些值直接进入/来自java对象，因此我希望尽可能避免后端代码的更改。@johnfarry您可以使用css伪类

：after

在输入框后添加一个百分号。