요즘은 회원가입폼을 넣을때 주소입력을 아예 빼고, 이메일만 받다가, 최근에 주소입력이 필요해서 오픈API를 찾다가 다음API를 사용해 보고 최고로 간단한 구현이라는 것을 알게 되었다.
아래는 소스 코드 입니다.
<tr>
<script src="http://dmaps.daum.net/map_js_init/postcode.js"></script>
<script>
function openDaumPostcode() {
new daum.Postcode({
oncomplete: function(data) {
// 팝업에서 검색결과 항목을 클릭했을때 실행할 코드를 작성하는 부분.
// 우편번호와 주소 정보를 해당 필드에 넣고, 커서를 상세주소 필드로 이동한다.
document.getElementById('PROFILE_TITLE').value = data.postcode1+data.postcode2+' '+data.address
//전체 주소에서 연결 번지 및 ()로 묶여 있는 부가정보를 제거하고자 할 경우,
//아래와 같은 정규식을 사용해도 된다. 정규식은 개발자의 목적에 맞게 수정해서 사용가능
//var addr = data.address.replace(/(\s|^)\(.+\)$|\S+~\S+/g, '');
//document.getElementById('addr').value = addr;
document.getElementById('PROFILE_TITLE').focus();
}
}).open();
}
</script>
<th><input type="button" onclick="openDaumPostcode()" value="주소찾기버튼" class="button default"></th>
<td style="vertical-align:middle"><input type="text" size="30" name="PROFILE_TITLE" id="PROFILE_TITLE" value="<?=$ROW['PROFILE_TITLE']?>" title="주소" class="type-text" style="width:90%"/></td>
</tr>
부가가치세 2기 납부절차를 정리해 봅니다 (0) | 2015.01.03 |
---|---|
홈페이지 유효성 검사 방법(http://www.w3.org/) (0) | 2014.12.14 |
자주사용하는 favicon.ico 생성하는 사이트 (0) | 2014.02.26 |
보유한 컴퓨터리페어장비 및 홈페이지제작툴 목록 (0) | 2013.10.26 |
무료디자인소스(웹사이트+모바일앱전용) 다운로드 받을 수 있는 곳 (0) | 2013.09.10 |
댓글 영역