WordPress 「contact-form7」というプラグインと、「ajaxzip3」というjavascriptを使って、郵便番号を入力したら自動で住所が入力されるように設定する
これ、約半日かけてできました。(こんな事を言ったら上司に怒られそうですが…。)
まず、2通りのパターンで、下記サイトからコピーし、テキストエディタに貼り付け、保存します。
# httpサーバの場合
http://ajaxzip3.googlecode.com/svn/trunk/ajaxzip3/ajaxzip3.js
# httpsサーバの場合
https://ajaxzip3.googlecode.com/svn/trunk/ajaxzip3/ajaxzip3-https.js
以下、コードです。
<head>
<script src="<?php bloginfo('template_url') ?>/js/jquery.js"></script>
<script src="<?php bloginfo('template_url') ?>/js/ajaxzip3.js" charset="UTF-8"></script>
<script type="text/javascript">
//<![CDATA[
jQuery(function(){
AjaxZip3.JSONDATA="http://ajaxzip3.googlecode.com/svn/trunk/ajaxzip3/zipdata";
jQuery('#zip').keyup(function(event){
AjaxZip3.zip2addr(this,'','addr','addr');
})
})
//]]>
</script>
</head>
後は、以下のコードになるように「contact-form」で設定して下さい。
郵便番号：
住所 ：
ポイントは、
内である「jQuery」内の、(‘#〇〇’)と、郵便番号欄の「input」内の、「id=”〇〇”」を同じにすることです。同様に、内である「jQuery」内の「AjaxZip3.zip2addr(this,”,’△△’,’△△’);」と、住所の「input」内の、「id=”△△”」を同じにすることです。