我正在做一个测验。但是,重置按钮在我的测验中不起作用。有人可以帮我吗?
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular.min.js"></script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
<p>Q1: What is capital of England? </p>
<ul>
<li><input type="radio" name="q1" value="1" ng-model="quiz.one"> London</li>
<li><input type="radio" name="q1" value="2" ng-model="quiz.one"> Brisbane</li>
</ul>
<p>Q2: What is capital of Austrailia? </p>
<ul>
<li><input type="radio" name="q2" value="1" ng-model="quiz.two"> Canberra</li>
<li><input type="radio" name="q2" value="2" ng-model="quiz.two"> Sydney</li>
</ul>
<button ng-click="show()">Click Me</button>
<button ng-click="reset()">Reset</button>
<script>
//module declaration
var app = angular.module('myApp',[]);
//controller
app.controller('myCtrl',function($scope){
$scope.quiz = {one:"", two:""};
$scope.show = function(){
alert("Done");
}
$scope.reset = function(){
angular.forEach($scope.quiz,function(val, key){
val = "";
val.checked = false;
});
}
});
</script>
</body>
</html>
最佳答案
请像这样更改重置功能。这会起作用的。
$scope.reset = function () {
angular.forEach($scope.quiz, function (val, key) {
$scope.quiz[key] = "";
});
}
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular.min.js"></script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
<p>Q1: What is capital of England? </p>
<ul>
<li>
<input type="radio" name="q1" ng-value="1" ng-model="quiz.one"> London</li>
<li>
<input type="radio" name="q1" ng-value="2" ng-model="quiz.one"> Brisbane</li>
</ul>
<p>Q2: What is capital of Austrailia? </p>
<ul>
<li>
<input type="radio" name="q2" ng-value="1" ng-model="quiz.two"> Canberra</li>
<li>
<input type="radio" name="q2" ng-value="2" ng-model="quiz.two"> Sydney</li>
</ul>
<button ng-click="show()">Click Me</button>
<button ng-click="reset()">Reset</button>
<script>
//module declaration
var app = angular.module('myApp', []);
//controller
app.controller('myCtrl', function ($scope) {
$scope.quiz = {
one: "",
two: ""
};
$scope.show = function () {
alert("Done");
}
$scope.reset = function () {
angular.forEach($scope.quiz, function (val, key) {
$scope.quiz[key] = "";
});
}
});
</script>
</body>
</html>
关于javascript - 重置单选按钮在 AngularJS 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43292467/