Input값을 받아서 어떻게 전달하나요?

카카오맵 API (지도/로컬)
1

왕초보입니다.


<script>
var mapContainer = document.getElementById('map'), // 지도를 표시할 div 
    mapOption = {
        center: new kakao.maps.LatLng(33.450701, 126.570667), // 지도의 중심좌표
        level: 3 // 지도의 확대 레벨
    };  

// 지도를 생성합니다    
var map = new kakao.maps.Map(mapContainer, mapOption); 

// 주소-좌표 변환 객체를 생성합니다
var geocoder = new kakao.maps.services.Geocoder();

// 주소로 좌표를 검색합니다
geocoder.addressSearch('제주특별자치도 제주시 첨단로 242', function(result, status) {

    // 정상적으로 검색이 완료됐으면 
     if (status === kakao.maps.services.Status.OK) {

        var coords = new kakao.maps.LatLng(result[0].y, result[0].x);

        // 결과값으로 받은 위치를 마커로 표시합니다
        var marker = new kakao.maps.Marker({
            map: map,
            position: coords
        });

        // 인포윈도우로 장소에 대한 설명을 표시합니다
        var infowindow = new kakao.maps.InfoWindow({
            content: '<div style="width:150px;text-align:center;padding:6px 0;">우리회사</div>'
        });
        infowindow.open(map, marker);

        // 지도의 중심을 결과값으로 받은 위치로 이동시킵니다
        map.setCenter(coords);
    } 
});    
</script>

‘제주특별자치도 제주시 첨단로 242’ <------------ 이 부분을 input 에 입력하고 검색 버튼을 눌렀을 때 바로 가기 하려는데, input값을 주소 대신에 어떻게 넣을 수 있나요? 샘플 참조하라는데 키워드 검색과는 다르게 아예 입력창이 없는데. 너무 어렵네요.

2

키워드로 장소검색하고 목록으로 표출하기 - Kakao 지도 Web API 예제를 변형해서 사용해주시면 될 것 같습니다.
현재 코드에서 form, input, button 요소를 추가하고
searchPlaces 함수처럼 input값을 가져와서 주소 검색을 호출할 수 있게 구현해주세요.

3 
<form id="form">
	<input type="text" id="msg">
	<button type="submit" id="btn">입력</button>
</form>

넣고

	var msg = input.value;

하고 해도 저 주소 넣는 부분에 도저히 msg 값을 넣을 수가 없는데요. 예제 좀 보여주세요. keyword 검색 예제는 샘플 자체가 달라서 아무 도움이 안됩니다.

4

id가 msg인 요소의 value를 가져오면 됩니다.
document.getElementById('msg').value;

5

답변 감사합니다.