jquery - 获取和操作具有相同类名的更多输入字段的正确方法是什么

Question

我想操纵用户输入字段。这是正确的方法吗？或者有什么想法可以最小化？

jsfiddle链接

html:

<div class="form-group">
    <input class="form-control value_no" id="01" type="text" value="0" />
</div>
<div class="form-group">
    <input class="form-control value_no" id="02" type="text" value="0" />
</div>

javascript:

$(document).ready(function(){
    $("#01").keyup(function () {
        var value = $(this).val();
        var result = value.replace(/[^0-9.]/g,'');
    $('#01').val(result);
    }).keyup();

    $("#02").keyup(function () {
        var value = $(this).val();
        var result = value.replace(/[^0-9.]/g,'');
    $('#02').val(result);
    }).keyup();
})

Answer 1

使用公共类和实例this来避免重复类似的代码：

$(".value_no").keyup(function () {
    var value = this.value
    var result = value.replace(/[^0-9.]/g,'');
    this.value = result;
}).keyup();

另外，使用this.value，而不是$(this).val()——不需要让 jQuery 高兴:)

Answer 2

您重复了太多代码（我怀疑您已经意识到了）。

改用查找两个输入的选择器。从您发布的代码中，“input.value_no”应该是一个很好的选择器，但是如果没有可用的整个 html 代码，就不可能说它是否会意外匹配更多控件：

$(document).ready(function(){
    $("input.value_no").keyup(function () {
        var value = $(this).val();
        var result = value.replace(/[^0-9.]/g,'');
        $(this).val(result);
    }).keyup();
})