210223-25日目
チェックリスト
商品詳細ページコメント
1)一度に10個のコメントをロードし,より多くのボタンを作成してクリックすると10個をロードする.現在のページ(rcp)とページサイズ(rps)のデータが必要です.
2)JSPで登録日(sql.Dateタイプ)をきれいに表示する方法を検索する
操作内容、トラブルシューティング
動的に追加されたhtml要素にイベントがバインドされていません.
1)コメントをajaxとして処理し、追加したhtml要素はイベントをトリガーしない
2)既存コード:$(ドキュメント).準備(関数){イベント処理ロジック});
3)解決後のコード:$(ドキュメント).on(「イベント」、「選択者」、関数(){イベント処理ロジック});
4)関連項目:https://sassun.tistory.com/134
//기존 요소의 이벤트 처리
$(document).ready(function(){
$("button").click(function(){
});
});
//동적으로 추가된 요소의 이벤트 처리
$(document).on("click","button",function(){
});//대댓글 입력 폼 보이게 하기
$(document).on("click",".re-reply[seq]",function(){
let bSeq = $(this).attr("seq");
$("div[seq="+bSeq+"]").toggleClass("show");
});
// 1. <div class="input-element re-reply-input">
// 2 .<div class="input-element show">
// 토글클래스 함수로 div의 클래스 이름이 클릭마다 1, 2로 바뀜..input-element.re-reply-input{
display : none;
}
.input-element.show{
display : block;
}<div class="reply-and-like">
<button class="re-reply" seq="${bookReview.br_seq}">댓글 </button>
<button id="re-like-it">좋아요!</button>
</div>
<-- 각각의 댓글 버튼과 숨길 div를 매핑하기 위해 임의로 seq 라는 속성을 부여했는데..... 문제가 없는 방법일지 모르겠음. -->
<div class="input-element re-reply-input" seq="${bookReview.br_seq}">
<div class="comment-form-comment">
<textarea name="br_comment" cols="40" rows="8"></textarea>
</div>
<div class="comment-submit">
<input type="submit" class="submit" id="re-submit" value="댓글 작성">
<input type="button" class="submit" id="re-del" value="삭제">
<input type="button" class="submit" id="re-up" value="수정">
</div>
</div>
Reference
この問題について(210223-25日目), 我々は、より多くの情報をここで見つけました https://velog.io/@betweenhj702/210223-25일차テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol