1222 TIL

looggi·2022년 12월 22일
2

스파르타 내배캠 AI-3

목록 보기
102/130
post-thumbnail

🐶 feedback

오전에 피드백받은 걸로 이슈를 만들었는데 와우 진짜 산넘어 산이다 좀 프로젝트가 부족하다는 생각이 들긴했는데 더 확고해진듯 ㅠㅠ 끝나면 혼자 프로젝트 하나 해볼까..? 근데 기능적으론 여기서 한거 이상으로는 못할 것 같은데 그래도 주제가 좀 더 괜찮으면 더 괜찮을 수도 있을 것 같고..? 모르겠당..

🌠 css

🌠 js

  • referrer : 지난 페이지 url 받아오기
    var referrer = document.referrer
    product_id=referrer.split('=')[1]
    
	var target = document.getElementById('detailBox')
    
    if (response.status==204){
        alert("삭제되었습니다")
        target.remove();
        window.history.back();// 이러면 뒤로가기라서 해당 커멘트가 새로고침해야지 없어짐
        location.href=`${FRONT_END_URL}/product-detail.html?product_id=${product_id}`
      }
  • 사진이 없는 경우 사진 박스 없애기
 //이미지 없는 경우 그냥 이미지 없는 채로 올라가게하기
    if (comment_detail_json.image == null){
        const commentBox = document.getElementById('commentBox')
        commentBox.innerHTML=`<table>
                                <tr class="comment-content-Box">
                                    <td colspan="4" class="comment-text">
                                        <p id="comment_text">${comment_detail_json.comment}
                                        </p>
                                    </td>
                                </tr>
                                <tr class="comment-info-Box">
                                    <td class="comment-date">
                                        <p id="date">${comment_detail_json.created_at.substr(0, 10)}</p>
                                    </td>
                                    <td class="clike-button">
                                        <p><button><i id="like_icon" class="bi bi-heart"></i></button></p>
                                    </td>
                                    <td class="like-count">
                                        <p id="like_count">좋아요 ${comment_detail_json.like.length}개</p>
                                    </td>
                                    <td class="comment-editdel" id=""><span id="">수정</span>/<span
                                        id="">삭제</span>
                                    </td>
                                </tr>
                            </table>`
    }
    else{
        const comment_image = document.getElementById("comment_image")
        comment_image.setAttribute("src", `${BACK_END_URL}${comment_detail_json.image}`)
        const comment_text = document.getElementById("comment_text")
        comment_text.innerText = comment_detail_json.comment
        const date = document.getElementById("date")
        date.innerText = comment_detail_json.created_at.substr(0, 10)
        const like_count = document.getElementById("like_count")
        like_count.innerText = '좋아요 ' + comment_detail_json.like.length + '개' 
    }

수정할 때 사진 넣을 곳이 없다고하면 어쩌나 걱정했는데 없을 때랑 있을 때를 애초에 나눠놔서 그런지 오류없이 잘 작동했당 다행

  • 엔터키 연결
  1. js에서 엔터키 실행하는 함수 정의 후
function enterkey() {
  if (window.event.keyCode == 13) 
  {
    login();
  }
}

엔터키를 눌렀을 때 동작이 실행될 부분에 추가해서 연결시켜준다

<input onkeyup="enterkey();" type="text"  value="" />

또는

  1. jquery를 이용
$("#SEARCH_KEYWORD").keyup(function(e){if(e.keyCode == 13)  login(); });
  • 좋아요 비동기

http://jsfiddle.net/jmnote/ubem6c0z/27/

profile
looooggi

0개의 댓글