javascript - 将选定的选项复制到另一个选择

Question

我觉得这个问题可能有答案，如果有的话，我找不到。

我有一份表格、帐单和送货地址。我有一个复选框，上面写着“帐单与送货地址相同”。选中该复选框后，我想将帐单地址部分中的所有值复制到送货地址选择。我已经能够很好地复制文本，但国家/地区的选择选项似乎比预期更棘手。这是我到目前为止所拥有的:

<select class="span12" id="BillingCountry" name="BillingCountry">
    <option value="AF">AFGHANISTAN</option>
    <option value="AX">ALAND ISLANDS</option>
    <option value="AL">ALBANIA</option>
</select>

<select class="span12" id="ShippingCountry" name="ShippingCountry">
    <option value="AF">AFGHANISTAN</option>
    <option value="AX">ALAND ISLANDS</option>
    <option value="AL">ALBANIA</option>
</select>

<label><input type="checkbox" id="duplicate-address" name="duplicate-address" value="shipping same as billing">&nbsp;&nbsp;Shipping address is same as billing</label>

$('#duplicate-address').click(function(e) {
    if( $('#duplicate-address').prop('checked') ){
        $("#ShippingAddress").val($("#BillingAddress").val()); //works
        $("#ShippingCountry").val($("#BillingCountry").val());
    }
});

因此，如果我选择帐单国家/地区阿尔巴尼亚并按下复选框，我希望看到发货国家/地区也选择阿尔巴尼亚。任何正确方向的指针都会很棒

Answer 1

如果您想要更改复选框状态，请在#ShippingCountry 中选择与#BillingCountry 中相同的选项，代码如下:

<select class="span12" id="BillingCountry" name="BillingCountry">
    <option value="AF">AFGHANISTAN</option>
    <option value="AX">ALAND ISLANDS</option>
    <option value="AL">ALBANIA</option>
</select>

<select class="span12" id="ShippingCountry" name="ShippingCountry">
    <option value="AF">AFGHANISTAN</option>
    <option value="AX">ALAND ISLANDS</option>
    <option value="AL">ALBANIA</option>
</select>

<label><input type="checkbox" id="duplicate-address" name="duplicate-address" value="shipping same as billing">&nbsp;&nbsp;Shipping address is same as billing</label>

$('#duplicate-address').click(function(e) {
    if( $('#duplicate-address').prop('checked') ){
     $('#ShippingCountry').val($('#BillingCountry option:selected').val())
    }
});

JSFIDDLE