溫馨提示×

溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

Angular.JS利用ng-disabled屬性和ng-model實現(xiàn)禁用button效果

發(fā)布時間：2020-10-13 04:09:32 來源：腳本之家 閱讀：126 作者：daisy 欄目：web開發(fā)

前言

本文要實現(xiàn)的效果是在輸入框內(nèi)無文字時，提交button是不能點擊狀態(tài)，在輸入文字后會變?yōu)榭牲c擊狀態(tài)，效果圖如下：

Angular.JS利用ng-disabled屬性和ng-model實現(xiàn)禁用button效果

Angular.JS利用ng-disabled屬性和ng-model實現(xiàn)禁用button效果

實現(xiàn)方法：

<div> 
 <div> 
  <textarea name="" id="" rows="3" class="form-control" ng-model="shyj" placeholder="在此輸入審批意見"></textarea> 
 </div> 
 <div> 
  <div> 
   <button class="btn btn-sm btn-block btn-primary" ng-disabled="!shyj" 
    ng-click="agreeClick(SM.YGBH,SM.RQ,shyj);" ng-tap="$navigate.go('/home')"> 
   提交 
   </button> 
  </div> 
 </div> 
</div>

controller里其實不用做什么操作，html已經(jīng)實現(xiàn)禁用效果了。放上來給大家隨便看看吧。

$scope.agreeClick=function(v_shyg,v_rq,shyj){//審核通過 
 $scope.v_shzt=0; 
 $scope.v_shyg=v_shyg; 
 $scope.v_rq=v_rq; 
 $scope.shyj=shyj; 
 $scope.v_lsh=0; 
 /*if(!$scope.shyj||$scope.shyj==''){ 
  myTip("審核意見不能為空"); 
  return false; 
 }*/ 
 HomeService.agreeClick({YGBH:$scope.YGBH,v_rq:$scope.v_rq,v_shzt:$scope.v_shzt,v_shyg:$scope.v_shyg,v_shyj:$scope.shyj,v_lsh:$scope.v_lsh}).then(function(data){ 
  var info=data.msg; 
  if (info[0].code === "0") {//查詢到結(jié)果 
  myTip("審核成功"); 
   $navigate.go("/LogList"); 
  }else{ 
   myTip("審核失敗:"+info[0].msg); 
  } 
//  console.log("desk: %o", data); 
//  $scope.LogList=data.answers[0]; 
//  $scope.abc=data.answers[0][0].YGBH; 
//  console.log("bb: %o",$scope.abc); 
   }); 
}

總結(jié)

以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作能帶來一定的幫助，如果有疑問大家可以留言交流，謝謝大家對億速云的支持。

向AI問一下細節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點不代表本網(wǎng)站立場，如果涉及侵權(quán)請聯(lián)系站長郵箱：is@yisu.com進行舉報，并提供相關(guān)證據(jù)，一經(jīng)查實，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手