网站建设分金手指专业十七,一台云服务器可以做几个网站,wordpress友情链接页面插件,wordpress 获取分类下面我就为大家分享一篇AngularJs点击状态值改变背景色的实例#xff0c;具有很好的参考价值#xff0c;希望对大家有所帮助。实例如下#xff1a;//更改边框颜色的代码 $(#shname).css({border:1px solid red});//排序有时候下标会错乱…下面我就为大家分享一篇AngularJs点击状态值改变背景色的实例具有很好的参考价值希望对大家有所帮助。实例如下//更改边框颜色的代码 $(#shname).css({border:1px solid red});//排序有时候下标会错乱 不建议使用 建议使用讲师排序代码*{margin: 0 auto;padding: 0;}.p{margin-top: 50px;width: 800px;height: 1000px;}.tian{width: 80px;height: 24px;background: #5CD6FF;}#sp{width: 150px;height: 24px;margin-left: 130px;border-radius: 10px;}#sj{height: 24px;margin-left: 20px;border-radius: 10px;}#st{height: 24px;margin-left: 30px;}#t{width: 14px;height: 14px;position: absolute;margin-left: -24px;padding-top: 6px;}#t1{width: 14px;height: 14px;position: absolute;margin-left: -24px;padding-top: 6px;}#table{margin-top: 50px;}.fh1{background: #FCFC30;}.true {background: greenyellow;border: 0px;border-radius: 3px;}.false {background: yellow;border: 0px;border-radius: 3px;}{{c}}id 商品名用户名手机号价格 城市下单时间 状态{{x.id}}{{x.sname}}{{x.name}}{{x.tel}}{{x.price|currency::}}{{x.cheng}}{{x.time|date:MM-dd HH:mm:ss}}添加订单信息商品名用户名手机号价格为请选择城市{{xx}}var appangular.module(myapp,[]);app.controller(mycr,function($scope){//select列表的值$scope.cha[按状态查询,已发货,未发货];$scope.cs[请选择城市,北京,天津,河北,上海];$scope.user[{flog:false,id:2001,sname:IphoneX,name:张三,tel:13525654123,price:8699,cheng:北京,time:14560161945000,zhuang:false,},{flog:false,id:3006,sname:Iphone6,name:王红,tel:12564236541,price:5635,cheng:郑州,time:1456016212945000,zhuang:false,},{flog:false,id:5312,sname:Iphone7,name:赵小龙,tel:13402651245,price:6180,cheng:北京,time:666016215645000,zhuang:false,},{flog:false,id:2314,sname:Iphone8,name:赵强,tel:17695212525,price:7190,cheng:上海,time:88888162545000,zhuang:false,}];//按照商品名称查询$scope.nameselectfunction(){$scope.sn$scope.msname;//手机号过滤器为空$scope.sh;}//按照手机号查询$scope.sjselectfunction(){$scope.sh$scope.mytel;//商品过滤器为空$scope.sn;}//已发货和未发货的点击事件$scope.myfhfunction(){if($scope.fh按状态查询){$scope.fahuo;}else if($scope.fh已发货){$scope.fahuotrue;$scope.sn;$scope.sh;}else{$scope.fahuofalse;$scope.sn;$scope.sh;}}//全选$scope.myqxfunction(){if($scope.qx){for (var i0;i$scope.user[i].flogtrue;}}else{for (var i0;i$scope.user[i].flogfalse;}}}//如果有一个没选全选取消$scope.dxfunction($index){if($scope.user[$index].flogfalse)$scope.qxfalse;}//批量删除$scope.pxfunction(){var j0;for (var i0;iif($scope.user[i].flog){j;}}if(j0){alert(请至少选择一个)}//判断所有选中的框 看其状态值为未发货 提示不能删除未发货的var flog1true;for (var i0;iif($scope.user[i].flog){if($scope.user[i].zhuangfalse)flog1false;}}if(flog1){for (var i$scope.user.length-1;i0;i--) {if($scope.user[i].flog){$scope.user.splice(i,1);//全部删除 全选为false$scope.qxfalse;}}}else{alert(不能删除未发货的)}}//根据id排序的方法var c0;$scope.idpfunction(){c;if(c%21){$scope.idpaiid;}else{$scope.idpai-id;}}//根据价格排序的方法$scope.jiapfunction(){c;if(c%21){$scope.idpaiprice;}else{$scope.idpai-price;}}//根据时间排序$scope.shipfunction(){c;if(c%21){$scope.idpaitime;}else{$scope.idpai-time;}}//点击新增的话显示添加$scope.addfunction(){$scope.yctrue;}//保存的代码$scope.baocunfunction(){flog kong($(#shname).val(),#s1)kong($(#username).val(),#s2)kong($(#mtel).val(),#s3)kong($(#mprice).val(),#s4)cheng();if(flog){var tian{flog:false,id:23236,sname:$scope.shname,name:$scope.username,tel:$scope.mtel,price:$scope.mprice,cheng:$scope.chengshi,time:14560201945000,zhuang:false,}//添加到表格中$scope.user.push(tian);//添加完毕后清空$scope.shname;$scope.username;$scope.mtel;$scope.mprice;//清空后隐藏$scope.ycfalse;}}//不为空的方法function kong(k1,s){var k/^\s*$/;if(k.test(k1)){$(s).html(不能为空);return false;}else{$(s).html();return true;}}//城市选择function cheng(){if($scope.chengshi请选择城市){$(#s5).html(必选);return false;}else{$(#s5).html();return true;}}/*x.zhang为发货的状态值 默认为false不发货 通过过滤器设置值为已发货和未发货//通过以下来设置背景颜色.true {background: greenyellow;border: 0px;border-radius: 3px;}.false {background: yellow;border: 0px;border-radius: 3px;}*///发货改变值的方法$scope.fahuo1 function($index) {if($scope.user[$index].zhuang ){$scope.user[$index].zhuang false;}else{$scope.user[$index].zhuang true;}}})//自定义过滤器根据zhuang的状态返回不同的值app.filter(myFilter, function() {return function(input) {if (input) {return 已发货;} else {return 未发货;}return input;}})上面是我整理给大家的希望今后会对大家有帮助。相关文章
