GASTRONGER.COM 毎月10万円の不労所得のために頑張り続ける孤高の集団チンパン団！その団員ルパンのウェブサイト！

都道府県選択するやつ。（自動選択版）

todouhuken
都道府県選択するやつ。｜CSS HappyLife
都道府県選択するやつ（JIS X0402・ISO 3166-2準拠版）

にインスパイアされて。

意味があるのか無いのか、正確なのか実用に耐えるのか分かりませんが、googleのwebAPIを使って訪れたユーザーの都道府県を自動的に選択するバージョンを作ってみました。一応、私の環境においてIE6,IE8,Firefox3.0にて動作確認をいたしました。

当然自由に使っていただいてかまいません。

[デモページ]

<head>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
window.onload = function(){ 

    if(google.loader.ClientLocation){
        client_prefectures = google.loader.ClientLocation.address.region;
        var form_load = document.forms[0].都道府県;
        for(i=0;form_load.length>i;i++){
            if (form_load.options[i].text == client_prefectures){
                form_load.options[i].selected = true;
                break;
            }
        }
    }else{
        alert('失敗しました。');
    } 

}
</script> 

</head> 

<body> 

<form> 

<select name="都道府県">
<option value="">都道府県をお選びください。</option>
<optgroup label="北海道・東北">
    <option value="01">北海道</option>
    <option value="02">青森県</option>
    <option value="03">岩手県</option>
    <option value="04">宮城県</option>
    <option value="05">秋田県</option>
    <option value="06">山形県</option>
    <option value="07">福島県</option>
</optgroup>
<optgroup label="関東">
    <option value="08">茨城県</option>
    <option value="09">栃木県</option>
    <option value="10">群馬県</option>
    <option value="11">埼玉県</option>
    <option value="12">千葉県</option>
    <option value="13">東京都</option>
    <option value="14">神奈川県</option>
</optgroup>
<optgroup label="甲信越・北陸">
    <option value="15">新潟県</option>
    <option value="16">富山県</option>
    <option value="17">石川県</option>
    <option value="18">福井県</option>
    <option value="19">山梨県</option>
    <option value="20">長野県</option>
</optgroup>
<optgroup label="東海">
    <option value="21">岐阜県</option>
    <option value="22">静岡県</option>
    <option value="23">愛知県</option>
    <option value="24">三重県</option>
</optgroup>
<optgroup label="関西">
    <option value="25">滋賀県</option>
    <option value="26">京都府</option>
    <option value="27">大阪府</option>
    <option value="28">兵庫県</option>
    <option value="29">奈良県</option>
    <option value="30">和歌山県</option>
</optgroup>
<optgroup label="中国">
    <option value="31">鳥取県</option>
    <option value="32">島根県</option>
    <option value="33">岡山県</option>
    <option value="34">広島県</option>
    <option value="35">山口県</option>
</optgroup>
<optgroup label="四国">
    <option value="36">徳島県</option>
    <option value="37">香川県</option>
    <option value="38">愛媛県</option>
    <option value="39">高知県</option>
</optgroup>
<optgroup label="九州・沖縄">
    <option value="40">福岡県</option>
    <option value="41">佐賀県</option>
    <option value="42">長崎県</option>
    <option value="43">熊本県</option>
    <option value="44">大分県</option>
    <option value="45">宮崎県</option>
    <option value="46">鹿児島県</option>
    <option value="47">沖縄県</option>
</optgroup>
</select> 

</form> 

</body>

上記は、インスパイア先のブログにあったJIS X0402 版というものを使わせていただきました。

フォームの部分をISO 3166-2 版に変更していただいても動作します。

上記のソースのままだと、フォームが別にある場合正しく動作しない場合があります。

その場合は下記をお使いください。

<head>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
window.onload = function(){ 

    if(google.loader.ClientLocation){
        client_prefectures = google.loader.ClientLocation.address.region;
        var form_load = document.フォーム.都道府県;
        for(i=0;form_load.length>i;i++){
            if (form_load.options[i].text == client_prefectures){
                form_load.options[i].selected = true;
                break;
            }
        }
    }else{
        alert('失敗しました。');
    } 

}
</script> 

</head> 

<body> 

<form name="フォーム"> 

<select name="都道府県">
<option value="">都道府県をお選びください。</option>
<optgroup label="北海道・東北">
    <option value="01">北海道</option>
    <option value="02">青森県</option>
    <option value="03">岩手県</option>
    <option value="04">宮城県</option>
    <option value="05">秋田県</option>
    <option value="06">山形県</option>
    <option value="07">福島県</option>
</optgroup>
<optgroup label="関東">
    <option value="08">茨城県</option>
    <option value="09">栃木県</option>
    <option value="10">群馬県</option>
    <option value="11">埼玉県</option>
    <option value="12">千葉県</option>
    <option value="13">東京都</option>
    <option value="14">神奈川県</option>
</optgroup>
<optgroup label="甲信越・北陸">
    <option value="15">新潟県</option>
    <option value="16">富山県</option>
    <option value="17">石川県</option>
    <option value="18">福井県</option>
    <option value="19">山梨県</option>
    <option value="20">長野県</option>
</optgroup>
<optgroup label="東海">
    <option value="21">岐阜県</option>
    <option value="22">静岡県</option>
    <option value="23">愛知県</option>
    <option value="24">三重県</option>
</optgroup>
<optgroup label="関西">
    <option value="25">滋賀県</option>
    <option value="26">京都府</option>
    <option value="27">大阪府</option>
    <option value="28">兵庫県</option>
    <option value="29">奈良県</option>
    <option value="30">和歌山県</option>
</optgroup>
<optgroup label="中国">
    <option value="31">鳥取県</option>
    <option value="32">島根県</option>
    <option value="33">岡山県</option>
    <option value="34">広島県</option>
    <option value="35">山口県</option>
</optgroup>
<optgroup label="四国">
    <option value="36">徳島県</option>
    <option value="37">香川県</option>
    <option value="38">愛媛県</option>
    <option value="39">高知県</option>
</optgroup>
<optgroup label="九州・沖縄">
    <option value="40">福岡県</option>
    <option value="41">佐賀県</option>
    <option value="42">長崎県</option>
    <option value="43">熊本県</option>
    <option value="44">大分県</option>
    <option value="45">宮崎県</option>
    <option value="46">鹿児島県</option>
    <option value="47">沖縄県</option>
</optgroup>
</select> 

</form> 

</body>

Comments

コメント無し

コメントする

名前 *

メール

ウェブサイトURL