如何制作一个 HTML 数字输入，将其值转换为十分之一（可能使用 jQuery）

Question

假设我有一个输入字段，例如<input type='number' id='input-tenths' />我想要实现的目标是将我放入该字段的数字视为“十分之一”而不是整数，例如：当我在此输入字段中输入 a 时3，我希望该字段的值为0.3之后，当我输入 a 时5，我希望该值变为3.5...然后 a 9，该值应变为35.9到目前为止，我已经尝试添加一个隐藏字段<input type='hidden' id='hidden-tenths'/>和一个类似的函数$('#input-tenths').on('input', function(e){    $('#hidden-tenths').val($('#hidden-tenths').val() + '' + $(this).val().slice(-1));    $(this).val($('#hidden-tenths').val() / 10);    $('#hidden-tenths').val($(this).val() * 10);});但这并不总是按预期工作（例如，当我在原始输入中退格时，会附加而不是删除一个数字，正如使用.slice(-1).什么是实现预期行为的好方法，我试图避免显式绑定所有按键，从而实质上重新编程输入字段（除非这是实现这一目标的唯一方法）。$('#input-tenths').on('input', function(e) {  $('#hidden-tenths').val($('#hidden-tenths').val() + '' + $(this).val().slice(-1));  $(this).val($('#hidden-tenths').val() / 10);  $('#hidden-tenths').val($(this).val() * 10);});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><input type='number' id='input-tenths' /><input type='number' id='hidden-tenths' />

Answer 1

高兴时将不透明度从 0.3 更改为 0。您可能想要隐藏小数

$('#hidden-tenths').on('input', function(e) {

  $('#input-tenths').val((this.value/10).toFixed(1))

});

#input-tenths { opacity:1; position:absolute; z-index:0; }

#hidden-tenths { opacity:.3; position:absolute; z-index:100; }

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input type='number' id='input-tenths' />

<input type='number' id='hidden-tenths' />