javascript - 我的美国号码格式代码中的有趣行为

Question

我正在尝试使 10 位数字看起来像美国电话号码(即(###) ###-####)。我的代码确实实现了第一个目标，但它也做了一些我不太明白的事情。输入数字时，字符“()”会在输入任何其他数字之前显示。我希望左括号首先出现，右括号在输入第三个数字后出现。请不要给我新的解决方案；尝试指出我所描述的问题。

<script type="text/javascript">
  $('.drumbi-caller-number').live('keydown', function (event) {
    if (event.keyCode == 8 || event.keyCode == 37 || event.keyCode == 39) {
    } else {
        inputval = $(this).val();
        var string = inputval.replace(/[^0-9]/g, "");
        var first3 = string.substring(0,3);
        var next3 = string.substring(3,6);
        var next4 = string.substring(6,9);  
        var string = ("(" + first3 + ")" + next3 + "-" + next4);
        $(this).val(string);
    }
});
</script>

这是一个显示此行为的 jsFiddle:http://jsfiddle.net/bigthyme/j6kHn/3/

Answer 1

将 keydown 替换为 keyup，在 keydown 上，输入元素的值不会更新

还可以有条件地设置您的字符串，前提是足够长:

var string = string.length > 2 ? ("(" + first3 + ")" + next3 + "-" + next4) : first3;

这里是代码:http://jsfiddle.net/j6kHn/10

顺便说一句:您还应该将 .live(...) 替换为 .on(...) 作为 .live()已弃用..