AngularJS:按下按钮(功能)禁用复选框

时间:2014-08-26 08:43:06

标签: jquery angularjs

我想做一个明确的"按钮,显然清除了everithyng,但我无法禁用复选框。 我正在使用AngularJS和JQuery,而且我正在登录屏幕。

HTML:
<div id="page_signin_content" data-role="content" style="width:75%;margin:0 auto;"> 
    <br>
    <br>
    <br>
<label for="basic">Usuario:</label>
<input type="text" ng-model="username" id='username' />

<label for="basic">Contraseña:</label>
 <input type="password" ng-model="password" data-clear-btn="true" autocomplete="off"        id='pass'>
<br><br>

<div style="width:75%;margin:0 auto;">
    <div style="width:90%;margin:0 auto;">
      <label class="checkbox">
                <input type="checkbox" value="remember-me" id="remember_me" > Remember me

            </label>


    </div>

<fieldset class="ui-grid-a">
<div class="ui-block-a"><a ng-click='signIn(username,password)' data-role="button">Log in</a></div>
<div class="ui-block-b"><a ng-click='clear()' data-role="button" id="clear" >Clear</a>                                                                       </div>    
</fieldset>

</div>

</div><!-- /content -->

JS:
$scope.clear=function(){
                        $scope.username = "";
                        $scope.password = "";



                    }

2 个答案:

答案 0 :(得分:1)

首先应将模型分配给复选框

<input type="checkbox" value="remember-me" id="remember_me" ng-model="remember"> Remember me

并以明确的功能

 $scope.remember= false;

答案 1 :(得分:1)

问题陈述不太清楚,但您可以在ng-disable和ng-checked的帮助下禁用单击复选框。这就是我为所有4个案例创建演示的原因

1.disable/enable toggle on click.
2.disable onclick. 
3.uncheck on click.
4.checked/unchecked toggle on click.

请查看这是否满足您的要求。这是链接 Fiddle link

这是我的代码

//html
<div ng-controller="MyCtrl">
    <h4>This toggles the disable enable</h4>
   <input    type="checkbox"   ng-disabled="checkMe"    />Toggles
    <button ng-click="check()">disable/enable</button>
       <br><br>
    <h4>This disables the checkbox onclick</h4>        
    <input    type="checkbox"   ng-disabled="checkMe1"    /> click to disble
    <button ng-click="check1()">disable</button><br><br>
    <h4>This unchekcs the checkbox</h4>          
    <input type="checkbox"   ng-checked="checkMe2"    /> click to disble
    <button ng-click="check2()">disable</button><br><br>
           <h4>This toggles check and uncheck the checkbox</h4>          
    <input type="checkbox"   ng-checked="checkMe3"    /> click to disble
    <button ng-click="check3()">disable</button>
</div>
    //app.js
    function MyCtrl($scope) {
       $scope.checkMe=false;
        $scope.check = function() {
        $scope.checkMe=!$scope.checkMe;
    }
        $scope.checkMe1=false;
        $scope.check1 = function() {
        $scope.checkMe1=true;
    }
        $scope.checkMe2=true;
        $scope.check2 = function() {
        $scope.checkMe2=false;
    }
        $scope.checkMe3=true;
        $scope.check3 = function() {
        $scope.checkMe3=!$scope.checkMe3;
    }
}