Javascript 合并两个jquery函数

我有一个工作jQuery解决方案，用于在表单中插入基于挪威4位zipcode的city。但是这种形式有两组地址，我不知道如何复制、重命名或合并jQuery函数

<form>
<!--address1-->
  <input type="text" name="ZIPCODE" id="USER.ZIPCODE" size="4" maxlength="8" />
  <input type="text" name="CITY" id="USER.CITY" size="30" maxlength="100" value="test" />
<!--address2-->
  <input type="text" name="ZIPCODE2" id="USER.ZIPCODE2" size="4" maxlength="8" />
  <input type="text" name="CITY2" id="USER.CITY2" size="30" maxlength="100" value="test" />

<script type="text/javascript">
  $(function(){
    $inputField = $("#USER\\.ZIPCODE");
            $outputField = $("#USER\\.CITY");
            $inputField.keyup(function(){
            if($inputField.val().match(/\d{4}/)) {
            $.getJSON("http://adressesok.posten.no/api/v1/postal_codes.json?postal_code="+$inputField.val()+"&callback=?",
            function(data){
                $outputField.val( data["postal_codes"][0]["city"] );
                $("#USER\\.CITY").attr('readonly','readonly');
                });
            } else {
                $outputField.val("?");
            }
    });
  });

  $(function(){
    $inputField = $("#USER\\.ZIPCODE2");
            $outputField = $("#USER\\.CITY2");
            $inputField.keyup(function(){
            if($inputField.val().match(/\d{4}/)) {
            $.getJSON("http://adressesok.posten.no/api/v1/postal_codes.json?postal_code="+$inputField.val()+"&callback=?",
            function(data){
                $outputField.val( data["postal_codes"][0]["city"] );
                $("#USER\\.CITY2").attr('readonly','readonly');
                });
            } else {
                $outputField.val("?");
            }
    });
  });
</script>
</form>

$（函数（）{
$inputField=$（“#用户\\.ZIPCODE”）；
$outputField=$（“#用户\\.CITY”）；
$inputField.keyup（函数（）{
if（$inputField.val（）.match（/\d{4}/））{
$.getJSON（“http://adressesok.posten.no/api/v1/postal_codes.json?postal_code=“+$inputField.val（）+”&回调=？”，
功能（数据）{
$outputField.val（数据[“邮政编码”][0][“城市]）；
$（“#USER\\.CITY”）.attr（'readonly'，'readonly'）；
});
}否则{
$outputField.val（“？”）；
}
});
});
$（函数（）{
$inputField=$（“#用户\\.ZIPCODE2”）；
$outputField=$（“#用户\\.CITY2”）；
$inputField.keyup（函数（）{
if（$inputField.val（）.match（/\d{4}/））{
$.getJSON（“http://adressesok.posten.no/api/v1/postal_codes.json?postal_code=“+$inputField.val（）+”&回调=？”，
功能（数据）{
$outputField.val（数据[“邮政编码”][0][“城市]）；
$（“#USER\\.CITY2”）.attr（'readonly'，'readonly'）；
});
}否则{
$outputField.val（“？”）；
}
});
});

我在这里浏览了很多关于合并jQuery函数和func1-func2方法的帖子，但没有抓住这一点。我想它也可以与某种if语句合并。工作示例单个地址：

---

（attr和prop都可能工作）

您应该创建一个函数并向其传递参数：

$(function(){
    function getCity(inputParam, outputParam){
        var inputField = $("#"+inputParam);
        var outputField = $("#"+outputParam);

        $(inputField).keyup(function(){
            if($(inputField).val().match(/\d{4}/)) {
                $.getJSON("http://adressesok.posten.no/api/v1/postal_codes.json?postal_code="+$(inputField).val()+"&callback=?",
                    function(data){
                        $(outputField).val( data["postal_codes"][0]["city"] );
                        $(outputField).attr('readonly','readonly');
                    });
            } else {
                $(outputField).val("?");
            }
        });
    }

    getCity('ZIPCODE1', 'CITY1'); 
    getCity('ZIPCODE2', 'CITY2');
});

如果要添加更多ZipCodes和City，只需添加：

  getCity('newZipCode', 'newCity');

工作区：

我真的不知道previus版本出了什么问题。如果你检查一下，我的变化不大。

海桑

我为你做了一把小提琴：

HTML

---

顺便说一句，逻辑从$（this）（触发代码的输入）中提取数据目标属性。此外，我还添加了用于触发事件的类。

因此我可以传递第一个参数getCity（'USER\\.ZIPCODE'，'USER\.CITY'），但如何传递第二个参数（'USER\\.ZIPCODE2'，'USER\.CITY2'）对不起。我一次只能得到一个参数集。不是两者都有。

<form>
<!--address1-->
  <input type="text" class="postNummer" data-target="postSted" name="ZIPCODE" id="USER.ZIPCODE" size="4" maxlength="8" />
  <input type="text" class="postSted" name="CITY" id="USER.CITY" size="30" maxlength="100" value="test" />
<!--address2-->
  <input type="text" class="postNummer" data-target="postSted2"  name="ZIPCODE2" id="USER.ZIPCODE2" size="4" maxlength="8" />
  <input type="text" class="postSted2" name="CITY2" id="USER.CITY2" size="30" maxlength="100" value="test" />
</form>

$( ".postNummer" ).change(function() {
            // first get the custom attribute data-target
            var theTarget = $( this ).attr("data-target");

            // empty the target
            $("input[class="+ theTarget +"]").val("");

            //If value over 4 in length and number
            if($( this ).val().match(/\d{4}/)) {

            // get data
            $.getJSON("http://adressesok.posten.no/api/v1/postal_codes.json?postal_code="+$( this ).val()+"&callback=?",
            function(data){
                 $("input[class="+ theTarget +"]").val( data["postal_codes"][0]["city"] ); // insert data
                 $("input[class="+ theTarget +"]").attr('readonly','readonly');    // make readonly
                });
            } else {
                $("input[class="+ theTarget +"]").val("?");
                $(this).effect( "shake" );
            }

  });