메뉴 건너뛰기

?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄


정산담당자
메모

아래는 소스 입니다.
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>last demo</title>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
    <button name="addStaff">정산담당자 추가</button>
    <br>
    <br>
    <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>



  1. No Image 22Dec
    by
    2016/12/22 Views 7732 

    하단 고정 레이어 스타일(CSS) 따라하기

  2. No Image 22Dec
    by
    2016/12/22 Views 6908 

    항상 레이어가 정 가운데 위치하는 스크립트

  3. No Image 22Dec
    by
    2016/12/22 Views 6470 

    scrolling to top

  4. Ajax를 이용한 데이터 조회시 로딩 로딩 이미지 보이기(jquery이용)

  5. No Image 22Dec
    by
    2016/12/22 Views 6217 

    금액단위 제거 표기

  6. No Image 22Dec
    by
    2016/12/22 Views 7108 

    시간 카운트

  7. No Image 22Dec
    by
    2016/12/22 Views 6347 

    디자인 셀렉트 박스 & CSS

  8. No Image 22Dec
    by
    2016/12/22 Views 8361 

    흐르는 배너 만들기2

  9. No Image 22Dec
    by
    2016/12/22 Views 10103 

    bxslider 멈춤현상

  10. No Image 22Dec
    by
    2016/12/22 Views 49605 

    jquery 플러그인 링크 모음

  11. No Image 18Nov
    by
    2016/11/18 Views 7118 

    html 테이블 고정 (table fixed)

  12. No Image 18Nov
    by
    2016/11/18 Views 7112 

    이미지 클릭 손 (cursor:pointer)

  13. No Image 18Nov
    by
    2016/11/18 Views 6931 

    jQuery Selector (셀렉터)

  14. 날짜 검색 범위 정하기 (jquery)

  15. No Image 17Nov
    by
    2016/11/17 Views 10055 

    jQuery 날짜 비교 (날짜비교)

  16. jQuery 카테고리 선택에 따른 하위 카테고리 변경 (selecbox)

  17. No Image 17Nov
    by
    2016/11/17 Views 10043 

    jquery radio checked (라디오 버튼 값으로 선택), 검색 조건 초기 셋팅

  18. No Image 17Nov
    by
    2016/11/17 Views 6511 

    jquery 뒤로가기

  19. No Image 17Nov
    by 조쉬
    2016/11/17 Views 8547 

    jQuery tr 추가 (입력창 추가), jQuery 테이블 행 추가/삭제, selector last name

  20. No Image 17Nov
    by
    2016/11/17 Views 6951 

    jQuery, JavaScript 새로고침(reload)

Board Pagination Prev 1 2 3 4 5 6 7 8 9 Next
/ 9

하단 정보를 입력할 수 있습니다

© k2s0o1d4e0s2i1g5n. All Rights Reserved