我正在处理一个按钮,它里面有一个单选按钮,我想要做的是当我点击按钮时,里面的单选按钮将被检查,这样我就可以获得我选择的值。我也喜欢它以角度方式做。
希望你能帮助我谢谢。
.role-tab-radio{
width: 30%;
margin: auto;
margin-top: 20px;
}
.role-tab-radio .btn{
border: 1px solid #FF5959;
color: #FF5959;
background-color: #FFF;
transition: .3s ease-in-out;
width: 49%;
display: inline-block;
}
.role-tab-radio .btn:hover{
opacity: 1 !important;
}
.role-tab-radio .btn.active,
.role-tab-radio .btn:active{
box-shadow: none;
background-color: #2A363B;
color: #FFF;
outline: 0;
border: 1px solid #2A363B;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<form ng-app="">
<div data-toggle="buttons" class="role-tab-radio">
<button class="btn btn-default"><input type="radio" name="q1" value="0">Black</button>
<button class="btn btn-default"><input type="radio" name="q1" value="1">White</button>
</div>
</form>
试试这个:
在 html 文件中:
<div class="role-tab-radio">
<button class="btn btn-default" ng-click="chooseColor(0)">Black</button>
<button class="btn btn-default" ng-click="chooseColor(1)>White</button>
</div>
在控制器中:
$scope.chooseColor = function(value){
console.log(value);
}
它的作用是当用户单击其中一个按钮时,它会触发chooseColor 函数,该函数将console.log 输出按钮中分配的值。
因此,您应该通过单击“黑色”按钮获得 0,通过单击“白色”按钮获得 1。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句