ajaxzip3を使おうと思ったら
新規の設置には yubinbangoライブラリの使用をオススメしています。
と書かれていたので設置をしたところ・・・
ボタンを押したら住所が入力されるようにしてほしいです！！！
と、強く希望されてしまったので、改変しました・・・。
ただ、このyubinbangoライブラリですが、keyupでのフィールド入力が
yubinbango.jsの中でガチガチに書かれている！！！
ということで、元ソースを書き直すことを余儀なくされたのですが、minifyされていてそのままでは読みづらいので、;の後で改行するようにまず置換しまして
11行目辺りになると思いますが
↓keyupのイベントを監視しているの部分を
r[r.length-1].addEventListener("keyup",function(e){t.prototype.u(n.v(e.target.parentNode))},!1)}})},t.prototype.v=function(t){return"FORM"===t.tagName||t.classList.contains("h-adr")?t:this.v(t.parentNode)},t.prototype.t=function(t){var e=t.querySelector(".p-country-name"),r=[e.innerHTML,e.value];
↓のようにボタンのクリックを監視するように書き変えます。
var btn = document.getElementById('zip-btn');
btn.addEventListener("click",function(e){t.prototype.u(n.v(e.target.parentNode))},!1)}})},t.prototype.v=function(t){return"FORM"===t.tagName||t.classList.contains("h-adr")?t:this.v(t.parentNode)},t.prototype.t=function(t){var e=t.querySelector(".p-country-name"),r=[e.innerHTML,e.value];
やっている内容としては
- var btn = document.getElementById(‘zip-btn’);の行の追記
- r[r.length-1] を btn に書き変え
- addEventListenerの後の “keyup” を “click”に書き変え
の3点になります。
入力用ボタンにid=”zip-btn”をつけてもらえば、後はyubinbangoのサイトに書かれている通りのclassを付けてもらえば、ボタンクリックのタイミングで住所が入るようになりますよ。