Question

我将姓氏字段设置为禁用。仅在输入名字后如何启用它。

 <form>
      <label for="fname">First name:</label><br>
      <input type="text" id="fname" name="fname"><br>
      <label for="lname">Last name:</label><br>
      <input type="text" id="lname" name="lname" disabled>
    </form>

Answer 1

尝试这样

component.ts

 user: any = {
    fname : '',
    lname: ''
  };

component.html

<form name="myform" #formdemo="ngForm">
    <label for="fname">First name:</label><br>
    <input type="text" id="fname"  class="form-control" #fname="ngModel" [(ngModel)]="user.fname" name="fname"  required/><br>


    <label for="lname">Last name:</label><br>
    <input type="text" id="lname" class="form-control"   [(ngModel)]="user.lname"  name="lname" [attr.disabled]="fname.hasError('required') ? true : null" required/><br>
</form>

Answer 2

请参阅工作示例。

function showMe(e) {
  if(e.value.length > 0){
    $("#lname").removeAttr("disabled");
  }
  else{
    $("#lname").attr("disabled", 'disabled');
  }
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
   <label for="fname">First name:</label><br>
   <input type="text" id="fname" name="fname" onkeyup="showMe(this)"><br>
   <label for="lname">Last name:</label><br>
   <input type="text" id="lname" name="lname" disabled>
</form>

仅在完成其他字段输入后才启用字段

2 个答案: