<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>二级联动</title> <script type="text/javascript" src="js/angular.min.js" ></script> <script type="text/javascript" src="js/jquery-3.2.1.min.js" ></script> </head> <body ng-app="myapp" ng-controller="myctrl"> <select ng-options="x.provice for x in datas" ng-model="select_provice" ng-init="select_provice=datas[0]" ng-click="changeProvice()" ></select> <select ng-options="y for y in select_provice.city" ng-model="select_city" ng-init="select_city=select_provice.city[0]" ></select> <button ng-click="getProvice()">获取省</button> <button ng-click="getCity()">获取市</button> <script type="text/javascript"> var app = angular.module("myapp",[]); app.controller("myctrl",function($scope){ $scope.datas=[ {"provice":"河南","city":["杞县","湖岗","高阳","开封","郑州"]}, {"provice":"北京","city":["后海","海淀","鸟巢","朝阳","黄埔"]}, {"provice":"上海","city":["东方明珠","湖岗","高阳","开封","郑州"]} ]; $scope.changeProvice=function(){ $scope.select_city=$scope.select_provice.city[0]; } $scope.getProvice=function(){ var p=$scope.select_provice.provice; alert(p); } $scope.getCity=function(){ var p=$scope.select_city; alert(p); } }); </script> </body> </html>
HTML二级联动
猜你喜欢
转载自blog.csdn.net/qq_19681347/article/details/79794455
今日推荐
周排行