html - form 表单 用户名提示和错误提示分开显示?
问题描述
点击输入框,显示用户名提示,点击立即注册按钮,在输入框下显示错误提示
<form name='checkForm' ng-init='isEmpty=false;'> <p class='form-group'><label class='col-sm-3 control-label'>用 户 名</label><p class='col-sm-8 account'> <input type='text' placeholder='您的账户名和登录名'ng-model='account'name='account'required='required'ng-pattern='regularList.account'ng-blur='checkForm.account.$blured = false;'ng-focus='checkForm.account.$blured = true;'autocomplete='off'/> <span ng-class='{’right’:(checkForm.account.$error.pattern),’error’:checkForm.account.$valid}'></span></p><span ng-messages='isEmpty && checkForm.account.$blured && checkForm.account.$error' role='alert'> <span ng-message='required' style='color: #ff0000'>用户名不能为空</span></span><span ng-messages='checkForm.account.$blured && checkForm.account.$error' role='alert'> <span ng-message='pattern'style='color: #ff0000'>用户名为4-20位中文数字与英文字母组成!</span></span> </p> <p ng-if='checkForm.account.$blured==true'><p ng-show='checkForm.account.$blured'> <i></i> <span>!支持中文、字母、数字、“-”“_”的组合,4-20个字符</span></p> </p>
具体效果如下
现在是输入内容不希望显示错误提示我现在的问题是,输入相应的内容,会有错误的提示,效果见下
目的:输入内容不提示错误,点击立即注册,如果不符合相应的规范,再提示错误。求指点,谢谢
问题解答
回答1:也是醉了。。。<input type='text' placeholder='您的账户名和登录名'
ng-model='account' ng-pattern='regularList.account'/>
<span ng-show='showAccountError' role='alert'>
<span style='color: #ff0000'>用户名为4-20位中文数字与英文字母组成!</span>
</span>当用户提交的时候,在controller中用正则判断$scope.account是否合法,不合法的话,就让$scope.showAccountError=true.在页面初始化的时候给这个变量赋false。
相关文章:
1. 微信开放平台 - Android调用微信分享不显示2. javascript - ie11以下单击打开不了file,双击可以。求解?3. javascript - js 有什么优雅的办法实现在同时打开的两个标签页间相互通信?4. javascript - 关于定时器 与 防止连续点击 问题5. objective-c - ios百度地图定位问题6. javascript - 求助这种功能有什么好点的插件?7. javascript - node.js服务端渲染解疑8. html5 - rudy编译sass的时候有中文报错9. 为何 localStorage、sessionStorage 属于html5的范畴,但是为何 IE8却支持?10. javascript - 求助关于js正则问题
