是否可以在不实际更改值本身的情况下格式化Input元素的文本值。例如,如果我输入以下格式的ID号:

19801010-1234


我希望该值为198010101234,但是当输入8个以上字符时,应显示连字符。我正在使用javascript和nodejs。

这是我目前拥有的:

的HTML

<input id="ssn"
       className= {styles.input}
       type="input"
       value= {this.format(personalNumber)}
       placeholder={translations.personalNumber}
       onChange={this.onChange} />


JS

format(value){
    if(value && value.length>8)
        return value.slice(0, 8) + " - " + value.slice(8);
    return value;
}


我正在使用react,以上内容当然会更改值本身以包含一个连字符,希望我能避免。

最佳答案

尝试这个:

<input type="text" id="num"> <span></span>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
    function formatVal(num) {
        num.length == 8 ? $('#num').val(num+'-') : '';
    };

    function origVal(num) {
        $('span').html(num.replace('-', ''));
    }

    $('#num').keypress(function() {
        formatVal($(this).val());
        origVal($('#num').val());
    });
</script>


可能不是最佳解决方案。但是有效

jsfiddle demo

关于javascript - 格式化输入类型文本而不更改值,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/40400540/

10-12 06:41