ExtJS4文本框使用正则表达式验证详解

"这篇资源主要介绍了如何在ExtJS4中使用正则表达式对文本框(textField)进行验证，包括两种不同的验证提示方式，并提供了多个具体的正则表达式实例，覆盖了邮政编码、中文、数字、URL、整数、IP地址、电话号码和手机号码等多种输入格式的验证。" 在ExtJS框架中，`textField`组件允许我们对用户的输入进行各种类型的验证，以确保数据的有效性。其中，`regex`属性用于指定一个正则表达式，当用户输入的数据不匹配这个正则表达式时，系统会进行错误提示。 对于正则表达式的验证，有两种显示方式： 1. **仅红色提示框**：当用户输入不符合规则的数据时，文本框下方会出现一个红色的提示信息，表明输入无效。 2. **带批注的提示信息**：如果希望在提示框边显示更详细的提示信息，需要在页面加载时调用`Ext.QuickTips.init();`，这样可以显示一个更直观的批注样式提示，提供更好的用户体验。 以下是一些常用的正则表达式示例： 1. 邮政编码验证：`/^[1-9]\d{5}(?!\d)$/`，用于检查输入是否为中国大陆的邮政编码。 2. 中文字符验证：`/^[\u4e00-\u9fa5]+$/i`，确保输入全为中文字符。 3. 数字电话号码验证：`/^\d+$/`，验证输入的电话号码只包含数字。 4. URL地址验证：` /^(http|https|ftp):\/\/(([A-Z0-9][A-Z0-9_-]*)(\.[A-Z0-9][A-Z0-9_-]*)+)(:(\d+))?\/?/i`，确认输入的URL符合标准格式。 5. 整数验证：`/^[-+]?[\d]+$/`，检查输入是否为整数，允许正负号。 6. IP地址验证：` /^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/`，验证输入是否为有效的IPv4地址。 7. 电话号码验证：`/^((0[1-9]{3})?(0[12][0-9])?[-])?\d{6,8}$/`，用于匹配中国大陆的电话号码格式。 8. 手机号码验证：`/(^0?[1][35][0-9]{9}$)/`，验证输入是否为中国大陆的手机号码。 在使用这些正则表达式时，记得在`regex`属性后面加上`/^`和`$/`，将正则表达式包裹起来，以确保它们被正确解析和执行。 通过这种方式，开发者可以利用ExtJS4的强大功能，创建出具有严格输入验证的用户界面，提高应用数据的准确性和安全性。同时，自定义的提示信息能够帮助用户更清楚地理解输入错误的原因，从而提高用户体验。