文書更新：2019年06月24日(月) 午後9時11分16秒

Home > その他 > 郵便番号 > JavaScript の利用 > yubinbango.js を使用( 180 )

Head部

<head>
<script src="https://yubinbango.github.io/yubinbango/yubinbango.js" charset="UTF-8"></script>
</head>

郵便番号から住所を検索

  1. 1ボックスで郵便番号7桁を入力させる場合（都道府県と以降の住所を分ける場合）
    2. 郵便番号:
    都道府県:
    住所:
    <!--上記のコードです-->
<form class="h-adr">
	
	<table>
		<tr><th>郵便番号:</th><td><input type="text" class="p-postal-code" size="8" maxlength="8"></td></tr>
		<tr><th>都道府県:</th><td><input type="text" class="p-region" readonly></td></tr>
		<tr><th>住所:</th>	<td><input type="text" class="p-locality p-street-address p-extended-address" readonly></td></tr>
	</table>
</form>

  2. 1ボックスで郵便番号7桁を入力させる場合（都道府県と以降の住所を分けない場合）
    3. 郵便番号:
    住所:
    <!--上記のコードです-->
<form class="h-adr">
	
	<table>
		<tr><th>郵便番号:</th><td><input type="text" class="p-postal-code" size="8" maxlength="8"></td></tr>
		<tr><th>住所:</th>	<td><input type="text" size="40" class="p-region p-locality p-street-address p-extended-address" readonly></td></tr>
	</table>
</form>

  3. 2ボックスで郵便番号を3桁-4桁形式で入力させる場合
    4. 郵便番号: －
    都道府県:
    市区町村:
    番地/ビル名:
    <!--上記のコードです-->
<form class="h-adr">
	
	<table>
		<tr><th>郵便番号:</th><td><input type="text" class="p-postal-code" size="3" maxlength="3"> － <input type="text" class="p-postal-code" size="4" maxlength="4"></td></tr>
		<tr><th>都道府県:</th><td><input type="text" class="p-region" readonly size="10"></td></tr>
		<tr><th>市区町村:</th><td><input type="text" class="p-locality" readonly size="30"></td></tr>
		<tr><th>番地/ビル名:</th><td><input type="text" class="p-street-address p-extended-address" readonly size="40"></td></tr>
	</table>
</form>