동적 행 추가 (clone, append)

동적으로 추가하는 방법은 간단하다.

clone으로 복사 -> append로 붙이기 ->remove로 삭제

자바스크립트 부분

$(document).ready(function () { //행삭제 $('#movie_url').on('click', '.row_delete', function () { row_delete($(this)); }); }); //영상추가 var addMovie = function() { var $e = $("#movie_url ul li:last").clone(); $e.find("input").val(""); $("#movie_url ul").append($e); } //영상 삭제 function row_delete(obj) { if($('#movie_url ul li').size() > 1){ $(obj).parent().remove(); } else { alert('마지막 데이터는 삭제 불가합니다.'); return false; } }  

html부분

<div id="movie_url"> 링크 추가 <a href='javascript:addMovie();'>[Add] </a> <ul> <li>url : <input type=text class=ed name=url id=txtUrl size=60 maxlength=255 value='<? echo htmlspecialchars2($row[url]) ?>' required itemname=''> <button class="row_delete">삭제</button></li> </ul> </div>