<form action="">
<label>基本應用</label>
<div id="twzipcode"></div>
<label>進階應用</label>
<div id="twzipcode_ADV"></div>
</form>
@import url(https://fonts.googleapis.com/css?family=Lily+Script+One);
form {
	margin:10% auto 0 auto;
	padding:30px;
	width:400px;
	height:auto;
	overflow:hidden;
	background:white;
	border-radius:10px;
}

form label {
	font-size:14px;
	color:darkgray;
	cursor:pointer;
}

form label,
form input,
form select{
	float:left;
}
form div{
  clear:both;
  overflow:hidden;
  padding:10px;
  margin-bottom:10px;
  background:#efefef;
  border-radius:5px;
}

form input ,
form select{
	margin:15px 0;
	padding:15px 10px;

	outline:none;
	border:1px solid #bbb;
	border-radius:5px;
  height:40px;
	display:inline-block;
	-webkit-box-sizing:border-box;
	   -moz-box-sizing:border-box;
	        box-sizing:border-box;
    -webkit-transition:0.2s ease all;
	   -moz-transition:0.2s ease all;
	    -ms-transition:0.2s ease all;
	     -o-transition:0.2s ease all;
	        transition:0.2s ease all;
}

form input[type=text]:focus,
form input[type="password"]:focus {
	border-color:cornflowerblue;
}

input[type=submit] {
	padding:15px 50px;
	width:auto;
	background:#1abc9c;
	border:none;
	color:white;
	cursor:pointer;
	display:inline-block;
	float:right;
	clear:right;
	-webkit-transition:0.2s ease all;
	   -moz-transition:0.2s ease all;
	    -ms-transition:0.2s ease all;
	     -o-transition:0.2s ease all;
	        transition:0.2s ease all;
}

input[type=submit]:hover {
	opacity:0.8;
}

input[type="submit"]:active {
	opacity:0.4;
}
$("#twzipcode").twzipcode();

$("#twzipcode_ADV").twzipcode({
zipcodeIntoDistrict: true, // 郵遞區號自動顯示在地區
css: ["city form-control", "town form-control"], // 自訂 "城市"、"地區" class 名稱 
countyName: "city", // 自訂城市 select 標籤的 name 值
districtName: "town" // 自訂地區 select 標籤的 name 值
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js
  2. https://cdn.jsdelivr.net/npm/jquery-twzipcode@1.7.14/jquery.twzipcode.min.js