AjaxZip3の処理を変更した話
大変便利なライブラリ
https://github.com/ajaxzip3/ajaxzip3.github.io
下記のようにinputのonKeyUpを使った場合
意図しない動きをすることがあった。
|
1 2 3 4 5 6 7 |
<input type="text" id="zip_code1" name="zip_code1" onKeyUp="AjaxZip3.zip2addr(this, 'zip_code2', 'address1', 'address1');" maxlength="3"> <input type="text" id="zip_code2" name="zip_code2" onKeyUp="AjaxZip3.zip2addr('zip_code1', this, 'address1', 'address1');" maxlength="4"> |
郵便番号を前半、後半の二つに分けている。
前半3桁。後半4桁です。
前半3桁、後半4桁入力すると住所欄に住所が入力される。
というのは正常な動き。
これを下記の条件にすると動きが変わる
「全角入力モードにした状態で前半3桁に7桁の郵便番号を入力するとonkeyupが作動し住所が入力される。」
入力確定前にonkeyupが動作しています。
inputはmaxlengthで3にしているので3桁しか入力されない。
onKeyUpはやめてjQueryで制御することにする。
|
1 2 3 4 5 |
$("#zip_code1,#zip_code2").on("keyup", function(){ if($("#zip_code1").val() != "" && $("#zip_code2").val() != ""){ AjaxZip3.zip2addr("zip_code1", "zip_code2",'address1','address1', '', '', false); } }); |
これで確定後の値で動作になるので意図した動きになりました。