커뮤니티
포인트
쿠폰
내 강의실
국비 신청 내역
증명서
계정
로그아웃
학습 질문
개발 일지
나의 활동
답변 완료
2-9 복붙 오류
undefined주차
북마크
김*원
댓글
3
추천
0
조회수
10
조회수
10
답변 완료

* 겪고 있는 문제 상황을 최대한 자세하게 작성해주세요.

* 문제 해결을 위해 어떤 시도를 해보았는지 구체적으로 함께 알려주세요.


강사님처럼 코드를 복사한 후 붙여넣기 하니 첫번쨰 스샷처럼 추가 문자가 붙어서 나오게 되고 이대로 실행을 누르니 두번째 스샷처럼

변수(?)코드값 그대로 나오게 됩니다.

세번째 스샷처럼 첫번째스샷에 표긴된 문자들을 삭제하니 아예 실행이 안됩니다.



스파르타 즉문즉답스파르타 즉문즉답


스파르타 즉문즉답



<!doctype html>
<html lang="ko">

<head>
<meta charset="UTF-8">
<title>JQuery 연습하고 가기!</title>
<!-- JQuery를 import 합니다 -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

<style type="text/css">
div.question-box {
margin: 10px 0 20px 0;
}

table {
border: 1px solid;
border-collapse: collapse;
}

td,
th {
padding: 10px;
border: 1px solid;
}


</style>

<script>
function q1() {
  $(`#names-q1`).empty()
$.ajax({
        type: "GET",
        url: "http://spartacodingclub.shop/sparta_api/seoulbike",
        data: {},
        success: function(response){
          let rows = response['getStationList']['row']
          for (let i = 0; i < rows.length; i++) {
              let name = rows[i]['stationName']
            let rack = rows[i]['rackTotCnt']
            let bike = rows[i]['parkingBikeTotCnt']


             let temp_html = '<tr>
                     <td>${name}</td>
                    <td>${rack}</td>
                     <td>${bike}</td>
                     </tr>'

             $(`#names-q1`).append(temp_html)
            }
        }
    })
}
</script>

</head>

<body>
<h1>jQuery + Ajax의 조합을 연습하자!</h1>

<hr />

<div class="question-box">
<h2>2. 서울시 OpenAPI(실시간 따릉기 현황)를 이용하기</h2>
<p>모든 위치의 따릉이 현황을 보여주세요</p>
<p>업데이트 버튼을 누를 때마다 지웠다 새로 씌여져야 합니다.</p>
<button onclick="q1()">업데이트</button>
<table>
<thead>
<tr>
<td>거치대 위치</td>
<td>거치대 수</td>
<td>현재 거치된 따릉이 수</td>
</tr>
</thead>
<tbody id="names-q1">
<tr>
<td>102. 망원역 1번출구 앞</td>
<td>22</td>
<td>0</td>
</tr>
<tr>
<td>103. 망원역 2번출구 앞</td>
<td>16</td>
<td>0</td>
</tr>
<tr>
<td>104. 합정역 1번출구 앞</td>
<td>16</td>
<td>0</td>
</tr>
</tbody>
</table>
</div>
</body>

</html>




취소
 공유
취소
댓글 0
댓글 알림
나의얼굴