关于javascript:如何在输入字段中的逗号后面只允许数字,一个逗号和两位数字?

How can I allow only numbers, one comma, and two digits after the comma in my input field?

本问题已经有最佳答案,请猛点这里访问。

我有一个输入字段,它只允许数字和一个点。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
$('.number').keypress(function(event) {
    var $this = $(this);
    if ((event.which != 46 || $this.val().indexOf('.') != -1) &&
       ((event.which < 48 || event.which > 57) &&
       (event.which != 0 && event.which != 8))) {
           event.preventDefault();
    }

    var text = $(this).val();
    if ((event.which == 46) && (text.indexOf('.') == -1)) {
        setTimeout(function() {
            if ($this.val().substring($this.val().indexOf('.')).length > 3) {
                $this.val($this.val().substring(0, $this.val().indexOf('.') + 3));
            }
        }, 1);
    }

    if ((text.indexOf('.') != -1) &&
        (text.substring(text.indexOf('.')).length > 2) &&
        (event.which != 0 && event.which != 8) &&
        ($(this)[0].selectionStart >= text.length - 2)) {
            event.preventDefault();
    }      
});
1
2
3
4
.number {
    padding: 5px 10px;
    font-size: 16px;
}

1
2
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
<input type="text" class="number" />

我想用这个作为货币,所以我需要一个逗号来代替这个点。所以我用逗号替换了函数中的每一个点。但它不起作用。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
$('.number').keypress(function(event) {
    var $this = $(this);
    if ((event.which != 46 || $this.val().indexOf(',') != -1) &&
       ((event.which < 48 || event.which > 57) &&
       (event.which != 0 && event.which != 8))) {
           event.preventDefault();
    }

    var text = $(this).val();
    if ((event.which == 46) && (text.indexOf(',') == -1)) {
        setTimeout(function() {
            if ($this.val().substring($this.val().indexOf(',')).length > 3) {
                $this.val($this.val().substring(0, $this.val().indexOf(',') + 3));
            }
        }, 1);
    }

    if ((text.indexOf(',') != -1) &&
        (text.substring(text.indexOf(',')).length > 2) &&
        (event.which != 0 && event.which != 8) &&
        ($(this)[0].selectionStart >= text.length - 2)) {
            event.preventDefault();
    }      
});

1
2
3
4
.number {
  padding: 5px 10px;
  font-size: 16px;
}
1
2
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
<input type="text" class="number" />


您需要将46更改为44,以便允许逗号而不是完全停止…

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
$('.number').keypress(function(event) {
    var $this = $(this);
    // this next line...
    if ((event.which != 44 || $this.val().indexOf(',') != -1) &&
       ((event.which < 48 || event.which > 57) &&
       (event.which != 0 && event.which != 8))) {
           event.preventDefault();
    }

    var text = $(this).val();
    // this next line...
    if ((event.which == 44) && (text.indexOf(',') == -1)) {
        setTimeout(function() {
            if ($this.val().substring($this.val().indexOf(',')).length > 3) {
                $this.val($this.val().substring(0, $this.val().indexOf(',') + 3));
            }
        }, 1);
    }

    if ((text.indexOf(',') != -1) &&
        (text.substring(text.indexOf(',')).length > 2) &&
        (event.which != 0 && event.which != 8) &&
        ($(this)[0].selectionStart >= text.length - 2)) {
            event.preventDefault();
    }      
});
1
2
3
4
.number {
  padding: 5px 10px;
  font-size: 16px;
}

1
2
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
<input type="text" class="number" />

我标记的两行用于检测用户是否按了"完全停止"键,并允许它(以及任何数字),但会阻止其他一切。46是一个句号的ASCII值,所以它只需要更改为44,这是一个逗号的ASCII值。


您只需将数字46(.)替换为44(,);

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
$('.number').keypress(function(event) {
    var $this = $(this);
    if ((event.which != 44 || $this.val().indexOf(',') != -1) &&
       ((event.which < 48 || event.which > 57) &&
       (event.which != 0 && event.which != 8))) {
           event.preventDefault();
    }

    var text = $(this).val();
    if ((event.which == 44) && (text.indexOf(',') == -1)) {
        setTimeout(function() {
            if ($this.val().substring($this.val().indexOf(',')).length > 3) {
                $this.val($this.val().substring(0, $this.val().indexOf(',') + 3));
            }
        }, 1);
    }

    if ((text.indexOf(',') != -1) &&
        (text.substring(text.indexOf(',')).length > 2) &&
        (event.which != 0 && event.which != 8) &&
        ($(this)[0].selectionStart >= text.length - 2)) {
            event.preventDefault();
    }      
});

1
2
3
4
.number {
  padding: 5px 10px;
  font-size: 16px;
}

1
2
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js">
<input type="text" class="number" />