| 정산담당자 | |
| 메모 |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 | <!doctype html><html lang="en"><head> <meta charset="utf-8"> <title>last demo</title></head><body> <button name="addStaff">정산담당자 추가</button> <table border="1" style="width:950px"> <tbody> <tr name="trStaff"> <td style="width:150px"><strong>정산담당자</strong></td> <td style="width:800px"> <input type="text" name="staff_name" placeholder="성명"> <input type="text" name="staff_contact" placeholder="연락처1"> <input type="text" name="staff_contact2" placeholder="연락처2"> <input type="text" name="staff_email" placeholder="이메일"> <select name="staff_use_yn"> <option value="Y">사용</option> <option value="N">미사용</option> </select> </td> </tr> <tr> <td><strong>메모</strong></td> <td> <textarea style="width:800px" name="memo" rows="3" placeholder="메모를 남겨주세요."></textarea> </td> </tr> </tbody> </table> <script> //추가 버튼 $(document).on("click","button[name=addStaff]",function(){ var addStaffText = '<tr name="trStaff">'+ ' <td class="active col-md-1"><strong>정산담당자</strong></td>'+ ' <td class="col-md-11">'+ ' <input type="text" class="form-control" name="staff_name" placeholder="성명">'+ ' <input type="text" class="form-control" name="staff_contact" placeholder="연락처1">'+ ' <input type="text" class="form-control" name="staff_contact2" placeholder="연락처2">'+ ' <input type="text" class="form-control" name="staff_email" placeholder="이메일">'+ ' <select class="form-control statusYn" name="staff_use_yn">'+ ' <option value="Y">사용</option>'+ ' <option value="N">미사용</option>'+ ' </select>'+ ' <button class="btn btn-default" name="delStaff">삭제</button>'+ ' </td>'+ '</tr>'; var trHtml = $( "tr[name=trStaff]:last" ); //last를 사용하여 trStaff라는 명을 가진 마지막 태그 호출 trHtml.after(addStaffText); //마지막 trStaff명 뒤에 붙인다. }); //삭제 버튼 $(document).on("click","button[name=delStaff]",function(){ var trHtml = $(this).parent().parent(); trHtml.remove(); //tr 테그 삭제 });</script> </body></html> |