index.ejs
6.71 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
<form action="" method="POST">
<input type="text" name="zipcode" id="sample3_postcode" placeholder="우편번호">
<input type="button" onclick="sample3_execDaumPostcode()" value="우편번호 찾기"><br>
<input type="text" name="addressK" id="sample3_address" placeholder="주소"><br>
<input type="text" name="detailaddressK" id="sample3_detailAddress" placeholder="상세주소">
<input type="text" name="extraaddressK" id="sample3_extraAddress" placeholder="참고항목">
<input type="text" name="addressE" class = "invisible">
<p> 사용할 해외 쇼핑몰 선택 후 변환</p>
<input type="radio" name="os" value="amazon" checked="checked">Amazon
<input type="radio" name="os" value="ebay">Ebay
<input type="submit" value="주소 변환">
</form>
<p> 사용할 해외 쇼핑몰 선택 후 변환</p>
<input type="radio" id="selshop" name="os" value="amazon" checked="checked">Amazon
<input type="radio" id="selshop" name="os" value="ebay">Ebay
<input type="button" value="주소 변환" onclick="translateprocess()">
<input type="submit" value="주소 변환">
Contry/Region: <input type="text" name="contry" placeholder="국가">
<div id="wrap" style="display:none;border:1px solid;width:500px;height:300px;margin:5px 0;position:relative">
<img src="//t1.daumcdn.net/postcode/resource/images/close.png" id="btnFoldWrap" style="cursor:pointer;position:absolute;right:0px;top:-1px;z-index:1" onclick="foldDaumPostcode()" alt="접기 버튼">
</div>
<script src="https://t1.daumcdn.net/mapjsapi/bundle/postcode/prod/postcode.v2.js"></script>
<script>
// 우편번호 찾기 찾기 화면을 넣을 element
var element_wrap = document.getElementById('wrap');
var englishadd;
document.getElementsByClassName('invisible')[0].style = "display:none;"
function foldDaumPostcode() {
// iframe을 넣은 element를 안보이게 한다.
element_wrap.style.display = 'none';
}
function sample3_execDaumPostcode() {
// 현재 scroll 위치를 저장해놓는다.
var currentScroll = Math.max(document.body.scrollTop, document.documentElement.scrollTop);
new daum.Postcode({
oncomplete: function(data) {
// 검색결과 항목을 클릭했을때 실행할 코드를 작성하는 부분.
// 각 주소의 노출 규칙에 따라 주소를 조합한다.
// 내려오는 변수가 값이 없는 경우엔 공백('')값을 가지므로, 이를 참고하여 분기 한다.
var addr = ''; // 주소 변수
var extraAddr = ''; // 참고항목 변수
//사용자가 선택한 주소 타입에 따라 해당 주소 값을 가져온다.
if (data.userSelectedType === 'R') { // 사용자가 도로명 주소를 선택했을 경우
addr = data.roadAddress;
document.getElementsByClassName('invisible')[0].value = data.roadAddressEnglish;
} else { // 사용자가 지번 주소를 선택했을 경우(J)
addr = data.jibunAddress;
}
// 사용자가 선택한 주소가 도로명 타입일때 참고항목을 조합한다.
if(data.userSelectedType === 'R'){
// 법정동명이 있을 경우 추가한다. (법정리는 제외)
// 법정동의 경우 마지막 문자가 "동/로/가"로 끝난다.
if(data.bname !== '' && /[동|로|가]$/g.test(data.bname)){
extraAddr += data.bname;
}
// 건물명이 있고, 공동주택일 경우 추가한다.
if(data.buildingName !== '' && data.apartment === 'Y'){
extraAddr += (extraAddr !== '' ? ', ' + data.buildingName : data.buildingName);
}
// 표시할 참고항목이 있을 경우, 괄호까지 추가한 최종 문자열을 만든다.
if(extraAddr !== ''){
extraAddr = ' (' + extraAddr + ')';
}
// 조합된 참고항목을 해당 필드에 넣는다.
document.getElementById("sample3_extraAddress").value = extraAddr;
} else {
document.getElementById("sample3_extraAddress").value = '';
}
// 우편번호와 주소 정보를 해당 필드에 넣는다.
document.getElementById('sample3_postcode').value = data.zonecode;
document.getElementById("sample3_address").value = addr;
// 커서를 상세주소 필드로 이동한다.
document.getElementById("sample3_detailAddress").focus();
// iframe을 넣은 element를 안보이게 한다.
// (autoClose:false 기능을 이용한다면, 아래 코드를 제거해야 화면에서 사라지지 않는다.)
element_wrap.style.display = 'none';
// 우편번호 찾기 화면이 보이기 이전으로 scroll 위치를 되돌린다.
document.body.scrollTop = currentScroll;
},
// 우편번호 찾기 화면 크기가 조정되었을때 실행할 코드를 작성하는 부분. iframe을 넣은 element의 높이값을 조정한다.
onresize : function(size) {
element_wrap.style.height = size.height+'px';
},
width : '100%',
height : '100%'
}).embed(element_wrap);
// iframe을 넣은 element를 보이게 한다.
element_wrap.style.display = 'block';
}
</script>
<script>
function translateprocess(){
var rawaddress = sample3_address.value;
var rawdetailAddress = sample3_detailAddress.value;
var rawextraAddress = sample3_extraAddress.value;
//autoRoadAddressEnglish;
var splitenglishadd = englishadd.split(", ");
var streetaddressE = splitenglishadd[0] + ", " +splitenglishadd[1] + ", " + splitenglishadd[2];
var cityE = splitenglishadd[3];
var stateE = splitenglishadd[4];
var rawsplitaddress = rawaddress.split(" ");
var text = "country/Region : \tKorea, Republic of" + "<br>Full name : \t영문이름" + "<br>Street address : \t" + streetaddressE + "<br>Street address : \t" + rawdetailAddress + rawextraAddress + "<br>City : \t" + cityE + "<br>State/ Province/ Region : \t" + stateE + "<br>Zip Code : \t\t" + sample3_postcode.value + "<br>Phone number : (+82)본인의 전화번호";
document.getElementById("englishaddress").innerHTML = text;
}
</script>
<div id="englishaddress">---<br></div>