<div class="container">
  <form class="h-adr">
    <span class="p-country-name" style="display:none;">Japan</span>
    〒<input type="text" class="p-postal-code" size="8" maxlength="8">
    <label>住所
     <input type="text" class="address p-region p-locality p-street-address p-extended-address" />
      </label>
  </form>
</div>
.container {
	margin: 30px;
}

input {
  font-size: 16px;
  margin-bottom: 15px;
}

label {
  display: block;
}

.p-region {
  display: inline-block;
  width: 270px;
}
document.querySelector(".p-postal-code").addEventListener(
    "keyup",
    function (e) {
        if (this.value.toString().match(/^[0-9]{7}$/) || this.value.toString().match(/^\d{3}-?\d{4}$/)) {
        document.querySelector(".address").focus();
        }
    },
    !1
);

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://yubinbango.github.io/yubinbango/yubinbango.js