月: 2021年10月

AjaxZip3の処理を変更した話
大変便利なライブラリ
https://github.com/ajaxzip3/ajaxzip3.github.io

下記のようにinputのonKeyUpを使った場合
意図しない動きをすることがあった。

<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で制御することにする。

$("#zip_code1,#zip_code2").on("keyup", function(){
	if($("#zip_code1").val() != "" && $("#zip_code2").val() != ""){
		AjaxZip3.zip2addr("zip_code1", "zip_code2",'address1','address1', '', '', false);
	}
});

これで確定後の値で動作になるので意図した動きになりました。