1

我有一个在表单中使用的用户控件。该控件包含两个标准的 Asp.Net 验证控件。

这是代码片段 - 如您所见，有一个必填字段验证器和一个正则表达式验证器：

<asp:Panel ID="pnlInputControl" runat="server" CssClass="input-control">
    <div class="input-wrapper input-text half-width">
        <asp:TextBox ID="tbInput" runat="server"
            CssClass="no-space"
            MaxLength="11"
            type="tel">
        </asp:TextBox>
    </div>
    <asp:RequiredFieldValidator ID="rfvInput" runat="server"
        ControlToValidate="tbInput"
        Display="Dynamic"
        SetFocusOnError="True"
        CssClass="validator">
    </asp:RequiredFieldValidator>
    <asp:RegularExpressionValidator ID="revInput" runat="server"
        ControlToValidate="tbInput"
        Display="Dynamic"
        SetFocusOnError="True"
        CssClass="validator">
    </asp:RegularExpressionValidator>
</asp:Panel>

我验证了一个电话号码 - 文本框本身也将字符数限制为 11，这是英国号码的最大大小。

这是一个示例正则表达式：

^0[12]\d{8,9}$- 家庭电话号码

我还尝试屏蔽输入，使用 javascript 函数删除空格 - 由文本框上标记为“no-space”的类触发。

$("body").on("input", "input.no-space", removeSpace);

function removeSpace() {
        $(this).val(function (_, v) {
            return v.replace(/\s+/g, '');
        });
    }

这在除 MS Edge 之外的所有浏览器上都能和谐地工作。

在 Edge 上，它破坏了 Asp.Net 验证——验证器没有启动——基本上它锁定了整个表单，因为它是一个必填字段。

问题是我没有收到任何错误，所以除了完全删除类并添加提示让用户知道不要输入空格之外，我不确定我还能做什么。

任何想法 - 要么解决问题，要么更好的解决方法？

4

2 回答 2

0

您可以简单地禁止在input type=tel文本框中按下“空格”键。

$('input[type=tel]').keydown(function (e) {
    return (e.keyCode !== 32);
});
于 2018-11-08T13:40:36.837 回答
0

当焦点从该特定输入字段更改时，我将允许更多字符并使用正则表达式来清理该字段。你如何用正则表达式清理它取决于你对用户的期望。如果您确信用户只会输入英国数字 - 您可以替换所有非数字字符。我不在 JQ 工作，但这是香草 JS

    <input id="phone">

    document.getElementById("phone").addEventListener("blur", phoneCleanup);
    function phoneCleanup() {
        var phone = this.value;
        this.value = phone.replace(/\D+/g, '');         
    }
于 2018-11-08T13:32:48.940 回答