메뉴 건너뛰기

조회 수 745 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

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

단축키

Prev이전 문서

Next다음 문서

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

다중 파일첨부한 내용을 표현할때 반복문을 사용하여 태그를 추가한다. 이때 같은 태그를 반복하기 때문에 같은 클래스명으로 추가 된다. 따라서 스크립트를 사용할때 제약이 걸린다. 


이때 태그 안에 data-item을 사용한다.(아래 div 코드가 여러개 존재)


<div id="file_div_<?= $row['file_no'] ?>">
    <input type="button" id="<?= $row['file_no'] ?>" onclick="del_file(this)" 
    data-item="<?= $row['file_no'] ?>" value="삭제하기">
</div>



반복문으로 여러개가 추가 됐을 input 태그에서 onclick으로 아래의 함수를 실행하고 자바스크립트로 값을 받아오고 로직을 처리한다.

function del_file(file_no){
    var file_no = file_no.getAttribute("data-item");
    console.log(file_no);
    $("#file_div_"+file_no).remove();
    $("#delete_file_list_div").append('<input name="delete_file[]" type="hidden" value="'+file_no+'" id="delete_file"/>');
}



List of Articles
번호 제목 날짜 조회 수
46 셀렉트(select) change 이벤트 (split) 2016.12.22 4165
45 셀렉트(select) change Ajax 이벤트 2016.12.22 4123
44 셀렉트(select) change href 이벤트 2016.12.22 4216
43 팝업창 가운데 띄우기 2016.12.22 4925
42 [INPUT BOX] 텍스트박스(INPUT 박스) 가 동적으로 추가,삭제됩니다 2017.02.18 5513
41 날짜 및 시간 입력 구현하기, Bootstrap DateTimePicker file 2017.04.06 9431
40 새로고침(F5) 금지 2018.03.28 2210
39 Javascript selectbox selected 컨트롤 file 2018.06.21 1414
38 스마트 에디터 (네이버 에디터) 에디터 내에서 이미지 크기 줄이기.(리사이징) file 2018.07.04 930
37 체크박스(CheckBox) 전체 선택, 전체 해제 checked file 2018.07.04 1100
36 SelectBox에서 선택된 항목의 텍스트, 값 가져오기 선택 옵션 넣기. 2018.07.04 948
» 반복문 사용할때 태그 식별하기 data-item 2018.07.04 745
34 스마트에디터(SmartEditor)에서 textarea 유효성 체크하기 2018.07.04 1313
33 다음 우편번호(주소) api 예시 file 2018.07.04 1540
32 cross site scripting을 막기위한...javascript 2018.07.24 711
31 유용한 스크립트 모음 2018.07.24 787
30 key pressing 누르거나 클릭중인 이벤트 예제 2018.08.29 526
29 테이블에서 해당 열의 인덱스 값 얻는 방법 2018.08.29 507
28 팝업창 차단 "허용 메시지" 2018.09.27 563
27 엔터키 / enter key submit form 2018.09.27 509
Board Pagination Prev 1 ... 2 3 4 5 6 7 8 9 10 11 Next
/ 11

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

© k2s0o1d4e0s2i1g5n. All Rights Reserved