728x90
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script src = "https://code.jquery.com/jquery-3.5.1.min.js"></script>
</head>
<body>
<!-- 중요하다 -->
<h3>Detail view</h3>
<textarea rows="2" cols="20">기본글입니다~~</textarea>
<br><br>
<button type="button" id= "answer">답글입력</button>
<!--답글이 추가될 div 창 -->
<div id = "answerFrm">
<!-- <br>답글: <input type ='text' id ='answerText'>
<button id = 'answerBtn'>답글작성완료</button> -->
</div>
<script type="text/javascript">
//첫번째 방식: 하이드 ,쇼우 기본폼이 정해졌을때는 이걸 사용하고
//두번째 방식: 스크립트에서 생성 갯수가 정해져있지 않을땐 이걸 사용
//$("answerFrm").hide();
$(document).ready(function() {
$("#answer").click(function() {
//$("answerFrm").show();
let txtf = "<br>답글: <input type ='text' id ='answerText'>";
$("#answerFrm").append(txtf);
//택스트 필드 변수
let btn = "<button id = 'answerBtn'>답글작성완료</button>";
$("#answerFrm").append(btn);
});
//이건 인식이 안되기때문에 사용불가
/* $("#answerBtn").click(function () {
alert("answerBtn.click");
}); */
$(document).on("click", "#answerBtn", function () {
alert("answerBtn onclick");
});
});
</script>
</body>
</html>

728x90
'HTML' 카테고리의 다른 글
39일차//XML// XML 실습1 (노드로 접근) (0) | 2021.03.09 |
---|---|
jQuery 요소의 선택 , 선택자 정리 블로그 (0) | 2021.03.08 |
38일차//JQuery/radio, prop 사용시 체크박스 체크된다 (0) | 2021.03.08 |
38일차//JQuery// button클릭시(태그 추가) 🧨text 추가방법 3가지(스크립트, 제이쿼리) (0) | 2021.03.08 |
38일차//JQuery// 과제 (요소값 변경, 값 가져오기) (0) | 2021.03.08 |