AngularJS实现的获取焦点及失去焦点时的表单验证功能示例
更新时间：2017年10月25日 10:22:57 作者：itsonglin
这篇文章主要介绍了AngularJS实现的获取焦点及失去焦点时的表单验证功能,涉及AngularJS使用ng-blur、ng-focus针对表单事件监听相关操作技巧,需要的朋友可以参考下
本文实例讲述了AngularJS实现的获取焦点及失去焦点时的表单验证功能。分享给大家供大家参考，具体如下：
<!DOCTYPE html>
<html ng-app="formExample">
<head>
<meta charset="UTF-8">
<title></title>
<script src="../js/angular.js"></script>
<script>
angular.module('formExample', [])
.controller('FormController', ['$scope', function($scope)
{
$scope.userType = 'guest';
$scope.change = false;
}]);
</script>
</head>
<body>
<form name="myForm" ng-controller="FormController">
userType: <input name="input" ng-model="userType" ng-blur="change=true" ng-focus="change=false" required>
<span class="error" ng-show="myForm.input.$error.required && change">必填项</span><br>
</form>
</body>
</html>
运行效果：
更多关于AngularJS相关内容感兴趣的读者可查看本站专题：《AngularJS指令操作技巧总结》、《AngularJS入门与进阶教程》及《AngularJS MVC架构总结》
希望本文所述对大家AngularJS程序设计有所帮助。
相关文章
这篇文章主要介绍了Angular Module声明和获取重载实例代码的相关资料,需要的朋友可以参考下2016-09-09
详解Angular4中路由Router类的跳转navigate
这篇文章主要介绍了详解Angular4中路由Router类的跳转navigate，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-06-06
这篇文章主要为大家介绍了angularjs实现多选框分段全选效果实现详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2023-06-06
Angularjs实现带查找筛选功能的select下拉框示例代码
这篇文章主要介绍了Angularjs实现带查找筛选功能的select下拉框的详细过程及示例代码，文中通过示例介绍的很详细，相信会对大家学习使用Angularjs具有一定的参考借鉴价值，有需要的朋友们可以一起来看看。2016-10-10
本篇文章主要介绍了AngularJs导出Excel的示例代码，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-08-08
本篇文章主要介绍了AngularJS实现页面定时刷新，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-03-03
AngularJS基础 ng-model-options 指令简单示例
本文主要介绍AngularJS ng-model-options 指令,这里对ng-model-options指令的基本资料进行整理,有需要的小伙伴可以参考下2016-08-08
这篇文章主要介绍了angularjs 表单密码验证自定义指令实现代码,需要的朋友可以参考下2016-10-10
这篇文章主要介绍了Angularjs中数据绑定的实例详解的相关资料,这里提供简单实例，大家可以参考下，希望通过本文可以掌握这部分内容，需要的朋友可以参考下2017-08-08
Angular2中constructor和ngOninit的使用讲解
这篇文章主要介绍了Angular2中constructor和ngOninit的使用讲解，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-05-05
最新评论