如何制作只包含数字和连字符(123-7898）的Devexpress texbox

How to make Devexpress texbox that only contains digits and hyphen(123-7898)

本文关键字：123-7898 Devexpress texbox 连字符 何制作 包含 数字      更新时间：2023-09-26

我使用的是devexpress控件，我有一个文本框，它应该只有一个连字符之间的数字，例如123-7898（7位数字和1个连字符），格式相同。

当用户自动输入前3位数字时，连字符将在第4位输入，之后用户可以输入最后4位数字。

请提供你的建议。

DevExpress编辑器允许您在编辑过程中使用掩码。请尝试将MaskSettings.Mask属性设置为"###-####"。在这种情况下，小数位数可以为空。

浏览文档，了解如何设置这些掩码，以及一个很好的掩码在线演示会让你知道得更好。

请参阅Mask Editing Overview文档中Devexpress编辑器控件的Masking功能。

您可以使用JavaScript处理此问题-

<script>
    function validatePhoneNumber(txtBoxObj) {
        if (txtBoxObj.value.length == 3 ) {
            txtBoxObj.value += "-";
        }
    }
    function getValue() {
        var phoneNumber = document.getElementById("phoneNumber").value;
        var a = phoneNumber.replace(/-/g, "");
        alert(a);
    }
    function isNumberKey(evt) {
        var charCode = (evt.which) ? evt.which : event.keyCode
        if (charCode > 31 && (charCode < 48 || charCode > 57))
            return false;
        return true;
    }
</script>

<input id="phoneNumber"onkeypress="return isNumberKey(event)"   onblur="validatePhoneNumber(this)" onkeyup="validatePhoneNumber(this)" type="text" maxlength="8"/>
<input type="button" onclick="getValue()"  title="submit" value="submit" />

相关文章：