

■ いろいろな API
<html>
<meta charset="utf-8">
<style> スタイル </style>
<p style="color:#456789;font-size:20px;font-weight:bold;margin:40px;">
※ ローカルから https://zipcloud.ibsnet.co.jp/ にアクセスして,
<br>(APIを利用し)郵便番号で地域名を検索できます.</p>
<p style="color:#ff4567;font-size:14px;font-weight:bold;margin:40px;">
インターネット接続が必要です.<br>
この html ファイルをサーバに設置しても作動いたしません.</p>
<p style="color:#ff4567;font-size:14px;font-weight:bold;margin:40px;">
ハイフンを入れて入力すること / 例: → 100-0002<br>
<span style="color:gray;font-size:16px;">結果: → 東京都千代田区皇居外苑</span></p>
<script> すくりぷと </script>
<form>
<input id="表示"type="text"size="9"maxlength="8"class="サーチ"placeholder="100-0002">
<script>document.write("<button type='button'onclick='検索結果();'>地域名 を 検索</button>");
</script>
<input type="text"id="ぼたん"size="46"class="サーチ">
</form>
<hr>
<input type="button"value=" リロード "onclick="window.location.reload(false);"class="リロード">
</html>
<style>
p{text-align:center;}
button{font-size:16pt;
margin:20px;}
input.サーチ{font-size:20pt;margin:40px;}
input.リロード{font-size:12pt;
color:#ff0000;
margin:0 auto;
display:block;}
form,button{text-align:center;
margin:0 auto;
display:block;}
::placeholder{color:#facebc;}
</style>
<script>
function 検索結果()
{document.getElementById("ぼたん").value="";
let zipcode=document.getElementById("表示").value;
let 新_たぐ=document.createElement("script");
新_たぐ.type="text/javascript";
新_たぐ.charset="utf-8";
新_たぐ.src="https://zipcloud.ibsnet.co.jp/api/search?zipcode="+zipcode+"&callback=郵便番号";
document.body.appendChild(新_たぐ);};
function 郵便番号(接続)
{let 絞り込み=document.getElementById("ぼたん");
絞り込み.value="";
if(接続.status !=200)
{alert(接続.message);
return false;}
if(!接続.results)
{alert("そのデータはありません");
return false;}
let 都道府県=接続.results[0].address1+接続.results[0].address2;
if(接続.results.length==1)
{都道府県+=接続.results[0].address3;}
絞り込み.value=都道府県;};
</script>
sample_STUDY_html_031_E
サンプル・ダウンロード ![]()
![]()

