1. Home
  2. Docs
  3. woocommerce product &#038...
  4. 주소 입력 시 다음 주소검색 스크립트 사용

주소 입력 시 다음 주소검색 스크립트 사용

<input type=”button” onclick=”openDaumPostcode()” value=”주소찾기”>

버튼 클릭 시 다음 주소 검색 스크립트가 작동이 되고,  ‘wcv_custom_product_address’ 라는 ID를 가진 텍스트 입력 필드에 다음 주소 검색을 통해 얻은 주소를 바로 입력해 줌.  여기서는 ‘주소를 입력해 주세요’라고 써있는 필드에 주소가 자동 입력 됨.

<input type=”text” class=”” style=”” name=”wcv_custom_product_address” id=”wcv_custom_product_address” value=”” placeholder=”주소를 입력해 주세요.” data-rules=”required” data-error=”에러: 주소를 입력해 주세요.”>

<!-- 다음 주소 검색 스크립트 -->
<script src="https://ssl.daumcdn.net/dmaps/map_js_init/postcode.v2.js"></script>
<script>
    function openDaumPostcode() {
        new daum.Postcode({
                oncomplete: function (data) {
                    // 팝업에서 검색결과 항목을 클릭했을때 실행할 코드를 작성하는 부분입니다.
                    document.getElementById('wcv_custom_product_address').value = data.address;
                    document.getElementById('wcv_custom_product_address').focus();
                }
            }).open();
    }
</script>