绪
由于项目需求，需要在前端实现手机号码的校验。当然了，对于基本的格式校验应该放在客户端进行，而不需要再将待校验的手机号发送至服务端，在服务端完成校验，然后将校验结果返回给客户端，客户端根据返回的结果再进行进一步的处理。如此反而复杂化了处理过程。
其实，处于安全考虑，应该在服务端进行二次校验。以下为在客户端的 JS 中校验手机号码格式的代码:
源代码
function validatemobile(mobile){ if(mobile.length==0){ alert('请输入手机号码！'); document.form1.mobile.focus();return false; }
if(mobile.length!=11){ alert('请输入有效的手机号码！');document.form1.mobile.focus();return false;} var myreg = /^((13[0-9])|(14[5|7])|(15([0-3]|[5-9]))|(18[0,2,3,5-9]))\\d{8}$/; if(!myreg.test(mobile)) { alert('请输入有效的手机号码！'); document.form1.mobile.focus(); return false; }}
复制代码
注：JS 中正则表达式的注意事项
在 JS 中//之间不需要转义！
常规的正则表达式的创建可用直接量，即斜杠 “/” 括起来的字符。但在要求参数变化的环境下，RegExp()构造函数是更好的选择：
var reg1 = /'\w+'/g;
var reg2 = new RegExp(''\w+'','g');
复制代码
对比两种创建方式，RegExp 中的第一个参数为要创建的正则字符串，一方面注意，因为不是直接量的表示形式，因此不用斜杠“ / ”括起来了；而是字符串中必须要对引号“ ‘ ”和转义符号“ \ ”进行二次转义。
此外，无论是直接量还是 RegExp()构造函数，都是生成了新的 RegExp 对象，并将其赋值给变量。
在《Javascript 权威指南》一书中讲到，对于正则表达式的直接量，ECMAscript 3 规定在每次它时都会返回同一个 RegExp 对象，因此用直接量创建的正则表达式的会共享一个实例。直到 ECMAScript 5 才规定每次返回不同的实例。
各浏览器中，IE 一直遵守 ECMAScript 5 中的规定，其他浏览器的较老版本则遵循 ECMAScript 3 的规定。因此在实际应用中，采取构造函数创建的方法比较安全，或者在使用 lastIndex 属性时要记得归 0。
AngularJS 常用知识汇总
app.controller('editCtrl',['$http','$location','$rootScope','$scope','$state','$stateParams',])
function($http, $location, $rootScope, $scope, $state, $stateParams){
// 上边声明添加显示的依赖注入，是为了防止，压缩（如UglifyJS）时改变function里的参数名，造成功能引用失败。推荐r.js压缩
// do something...
}
复制代码
获取路由的参数
$stateParams.id // #/camnpr/editCtrl?id=1
复制代码
跳转路由状态
$state.go('camnpr.appManager'); // 跳转后的URL： #/camnpr/appManager
$location.path('camnpr/appManager'); // 功能也是跳转
ui-router扩展的跳转方式
<a ui-sref="camnpr.appManager">跳转</a> // 需要angular-ui-router
复制代码
在 ng-repeat 里显示序号： $index // 这个是从 0 计数的。
get 请求
$http({
method: 'get',
url: 'http://camnpr.com/getAPI/',
params:{id: 1},
headers: {'x-camnpr-uid': '1000'}//可以加入任意的头信息
});
复制代码
post 请求
$http({
method: 'post',
url: 'http://camnpr.com/postAPI/',
data:'id=1&referrer=camnpr.com', // 这里是字符串，格式请注意，同时我们可以使用 $.param({id:1, referrer: 'camnpr.com'})来获取等价的形式。
// Form Data获取方式 Request.Form['id'] 。
//这是加'Content-Type': 'application/x-www-form-urlencoded',的功劳。
// 若不加'Content-Type',则：Request Payload：id=1&referrer=camnpr.com
// data: {id: 1, referrer: 'camnpr.com'}, // 是对象，那么 Form Data的数据是： {"id":1,"referrer":"camnpr.com"}:
headers: {'Content-Type': 'application/x-www-form-urlencoded', 'x-camnpr-uid': '1000'}
});
复制代码
根据 selector 获取元素
angular.element('.is_select') // [<input type="checkbox" value="1" class="is_select">]
循环获取并操作
angular.forEach(document.getElementsByClassName('is_select'), function(item, index){
if(item.checked){
ids+=item.value+',';
}
});
复制代码
ng-click 里带当前的 a，button 等的事件
<button ng-click="camnpr.submitAdd($event)" class="btn btn-primary ladda-button" data-style="zoom-in"> <span class="ladda-label">提交</span></button> // $event.target.currentTarget
复制代码
评论