在表（HTML）中从一个下拉菜单到另一个下拉菜单中预定义/预渲染数据？

Question

我有一个带有两个下拉菜单的表格（（通过选择第一个下拉菜单的字母M-给莫斯科），具有'change'功能。但这仅适用于第一行而不适用于第二行应该进行哪些更改才能使其在第二行中工作

                $(function() { 
                $("#select1").change(function() {
                    $("#select2").val($(this).val());
                });
                });
            

                <table>
                <tr>
                <th><select id="select1">
                <option>1day</option>
                <option value="1">Letter M</option>
                <option>3day</option>
                </select></th>
                <th><select id="select2">
                <option>Tokyo</option>
                <option value="1">Moscow</option>
                <option>Berlin</option>
                </select></th>
                </tr>
                <tr>
                <th>
                <select>
                <option>1day</option>
                <option value="1">Letter M</option>
                <option>3day</option>
                </select></th>
                <th><select>
                <option>Tokyo</option>
                <option value="1">Moscow</option>
                <option>Berlin</option>
                </select></th>
                </tr>
            

Answer 1

为不同的字段提供不同的ID。为第一列选择字段提供相同的类名。为第二列选择字段提供以第一列ID开头的ID名称，并在第一列ID之后添加一些前缀数字。

$(function() { 
    $(".select1").change(function() {
    	var id = $(this).attr('id');
      $("#"+id+'_1').val($(this).val());
    });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table>
                <tr>
                <th><select id="select1" class="select1">
                <option>1day</option>
                <option value="1">Letter M</option>
                <option>3day</option>
                </select></th>
                <th><select id="select1_1" >
                <option>Tokyo</option>
                <option value="1">Moscow</option>
                <option>Berlin</option>
                </select></th>
                </tr>
                <tr>
                <th>
                <select id="select2" class="select1">
                <option>1day</option>
                <option value="1">Letter M</option>
                <option>3day</option>
                </select></th>
                <th><select id="select2_1">
                <option>Tokyo</option>
                <option value="1">Moscow</option>
                <option>Berlin</option>
                </select></th>
                </tr>