尹广磊 发表于 2019-12-17 18:57:53

练习手机号的输入验证



演示地址:http://cloud.hiaxure.com/jdme1j/

只是练习条件判断的一些功能,做练习没有必要做到这个程序,不同情况在旁边写出注释说明即可。


复杂案例

输入框主要判断逻辑:

1. 输入框不为空时,显示清空按钮。
2. 输入框是数字,不包含空格,且小于等于11位时,将输入的内容保存到变量先存起来。
3. 如果输入的不符合上述条件,则清除刚刚输入的内容,恢复到之前存储在变量中的内容。
4. 如果输入达到11位了,使提交按钮变为高亮的“选中”状态。
5. 如果没有达到11位,提交按钮一直是灰色状态。

提交按钮主要判断逻辑:

1. 输入手机号为空,提示请输入手机号。让提示语的宽度随提示字数的多少变化。
2. 如果手机号在1~11位之间,提示请输入正确的手机号。让提示语的宽度随提示字数的多少变化。
3. 否则,认为输入正确,进入到验证码页面。


简单案例

输入框主要判断逻辑:

1. 在输入框右键指定了“最大长度”为11。
2. 如果输入框不为空,显示清空按钮。使提高按钮变为高亮的“选中”状态。
3. 否则,不显示清空按钮,提高按钮为非高亮状态。

提交按钮主要判断逻辑:

1. 如果输入框为11位且为数字,且认为输入正确进入验证码页面。
2. 否则提示请输入正确的手机号。


源文件:

尹广磊 发表于 2019-12-31 09:56:06

在当前页显示验证码的演示动画。


页: [1]
查看完整版本: 练习手机号的输入验证