자바 스크립트 양식 중복

Question

해당 디렉터/회원 양식을 복제하려고합니다. 다른 멤버를 추가하기 위해 단추를 추가하고 마지막 항목을 지우려면 삭제하고 싶습니다. 코드는 어느 시점에서 작동하는 것처럼 보였지만 이제는 더 이상 작동하지 않습니다. 내가 바꾼 것을 기억하지 마라. 추가 버튼은 정상적으로 작동하지만 삭제 버튼은 비활성화되어 있습니다. 그리고 의도적으로 사용하도록 설정하면 올바르게 작동하지 않습니다.

이사/회원

 <hr> 
     <b>Corporations:</b> Please list each director of the company.<br> 
     <b>LLCs:</b> Please list each member (owner) of the company.<br> 
     <b>Non-Profits: </b> Please enter information for at least three (3) unrelated directors if filing for 501(c)(3) status.<br> 
     <br> 

     <?php $y=0; $clone =1; do{ ?> 

      <div id="<?php echo "clonedSection$clone"; ?>" class="clonedSection" > 

       <p><label id="<?php echo "member_label$clone"; ?>" > <?php echo "Director/Member $clone"; ?></label> </p> 
       <p>First name:<input type="text" name="member_firstname" id="member_firstname" value="<?php echo $split_members[$y][0];?>"> <span class="error"> <?php echo $member_errors[$y]["member_first_name"];?></span> </p> 
       <p>Last name:<input type="text" name="member_lastname" id="member_lastname" value="<?php echo $split_members[$y][1];?>"> <span class="error"> <?php echo $member_errors[$y]["member_last_name"];?></span> </p> 
       <p>Street address:<input type="text" name="member_address" id="member_address" value="<?php echo $split_members[$y][2];?>"> <span class="error"> <?php echo $member_errors[$y]["member_address"];?></span> </p> 
       <p>City: <input type="text" name="member_city" id="member_city" value="<?php echo $split_members[$y][3];?>"> <span class="error"> <?php echo $member_errors[$y]["member_city"];?></span> </p> 
       <p>State:<select name="member_state" id ="member_state"> 
        <?php //$states = listStates(statesList()); 
        foreach($states as $value){ 
         echo '<option >'.$value.'</option>'; 
        } echo '<option selected>'.$split_members[$y][4].'</option>'; ?> 
       </select> <span class="error"> <?php echo $member_errors[$y]["member_state"];?></span> </p> 
       <p>ZIP code:<input type="text" name="member_zip" id="member_zip" value="<?php echo $split_members[$y][5];?>"> <span class="error"> <?php echo $member_errors[$y]["member_zip"];?></span> </p> 

      </div> 
     <?php $y++; $clone++;}while($y < count($split_members)); ?> 
     <div> 
      <input type="button" id="btnAdd" value="add another member" /> 
      <input type="button" id="btnDel" value="remove member" /> 
     </div> 

<script src="http://code.jquery.com/jquery-1.4.2.js" type="text/javascript"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 



     $("#btnAdd").click(function() { 



      var num = $(".clonedSection").length; 
      var newNum = new Number(num + 1); 

      var newSection = $("#clonedSection" + num).clone().attr("id", "clonedSection" + newNum); 

      newSection.children(":nth-child(1)").children(":first").attr("id", "member_label" + newNum); 
      newSection.children(":nth-child(2)").children(":first").attr("id", "member_firstname" + newNum).attr("name", "member_firstname" + newNum); 
      newSection.children(":nth-child(3)").children(":first").attr("id", "member_lastname" + newNum).attr("name", "member_lastname" + newNum); 
      newSection.children(":nth-child(4)").children(":first").attr("id", "member_address" + newNum).attr("name", "member_address" + newNum); 
      newSection.children(":nth-child(5)").children(":first").attr("id", "member_city" + newNum).attr("name", "member_city" + newNum); 
      newSection.children(":nth-child(6)").children(":first").attr("id", "member_state" + newNum).attr("name", "member_state" + newNum); 
      newSection.children(":nth-child(7)").children(":first").attr("id", "member_zip" + newNum).attr("name", "member_zip" + newNum); 


      $(".clonedSection").last().append(newSection); 

       elem = document.getElementById('member_label' + newNum); 
       elem.innerHTML = "Director/Member " + newNum; 

       elem = document.getElementById('member_firstname' + newNum); 
       elem.value = ""; 
       elem = document.getElementById('member_lastname' + newNum); 
       elem.value = ""; 
       elem = document.getElementById('member_address' + newNum); 
       elem.value = ""; 
       elem = document.getElementById('member_city' + newNum); 
       elem.value = ""; 
       elem = document.getElementById('member_state' + newNum); 
       elem.value = ""; 
       elem = document.getElementById('member_zip' + newNum); 
       elem.value = ""; 


      btnDelete = document.getElementById('btnDel'); 
      btnDelete.attr("disabled",""); 
      //$("#btnDel").disabled = false; 
      alert(newNum); 



      if (newNum == 12) 
       $("#btnAdd").attr("disabled","disabled"); 
     }); 

     $("#btnDel").click(function() { 

      var num = $(".clonedSection").length; // how many "duplicatable" input fields we currently have 

      $("#clonedSection" + num).remove();  // remove the last element 
      // enable the "add" button 
      $("#btnAdd").attr("disabled",""); 

      // if only one element remains, disable the "remove" button 
      if (num-1 == 1) 
       $("#btnDel").attr("disabled","disabled"); 

     }); 

     $("#btnDel").attr("disabled","disabled"); 
     var count = $(".clonedSection").length; 
     if (count > 1) 
      $("#btnDel").attr("disabled",""); 
      //$("#btnDel").disabled = false; 

    }); 
</script> 

Answer 1

사용 .prop("disabled",false); 및 .prop("disabled",true); 대신

.attr("disabled",""); 및 .attr("disabled","disabled");