Question

首先抱歉重新发帖，我投票删除了我的旧帖子，因为我现在正在寻求代码的帮助，而不是哪条路是更好的路线。我的任何代码都改变了几次

在我的页面上有一个下拉列表，用于选择从db动态加载的国家/地区。一旦用户选择了一个国家，就会发生两件事。 1）如果他们选择加拿大或美国，则会出现第二个下拉菜单，用户可以选择一个地区。 2）如果用户选择任何其他国家，则创建输入框，以便用户可以键入该区域。一切正常。

现在有第三个输入采用省/州值，因此可以发布。我们只有两个人会使用这个表单，所以我不担心JavaScript在浏览器中被关闭。

我的问题是，当用户首次选择加拿大/美国和某个地区时，除非他们更改国家/地区选择，否则不会在第三个输入中填充任何内容。但是，如果他们选择加拿大/美国以外的国家/地区并且必须输入该地区，则按预期工作。

以下是此问题的示例：http://jsfiddle.net/owalsh/BQXZA/3/

如果有人能告诉我为什么我会感激它，谢谢

Answer 1

在此工作：http://jsfiddle.net/5A4v4/11/

<强> HTML：

<form id="customer_bill_add_post" name="customer_bill_add_post">
<select id="country" name="country">
    <option value="0">Select a country</option>
    <option value="CA">Canada</option>
    <option value="US">United States</option>
    <option value="OT">Other</option>

</select>

<select id="province_select" name="province_select">
    <option value="0">Select a Province</option>
    <option value="AB">Alberta</option>
    <option value="AL">Alabama</option>
</select>

<input type="text" id="province_input" name="province_input">
<input type="text" id="province" name="province" />
    </form>

Jquery：代码（进行了一些额外的更改事件绑定）你可以对它进行美化。

        $(function(){
            //initially hide the textbox
            $("#province_input").hide();
            $("#province_select").hide();

            $('#country').change(function() {
                if($(this).find('option:selected').val() == "CA"){
                 $("#province_select").show();
                 $("#province_input").hide();
                 } else if($(this).find('option:selected').val() == "US"){
                 $("#province_select").show();
                 $("#province_input").hide();
                 } else {
                 $("#province_input").show();
                 $("#province_select").hide();
                }
             });


$('#country, #province_select, #province_input').bind("change", function() {
    if($('#country').find('option:selected').val() == "CA"){  
    document.customer_bill_add_post.province.value = document.customer_bill_add_post.province_select.value;
    } else if($('#country').find('option:selected').val() == "US"){
        document.customer_bill_add_post.province.value = document.customer_bill_add_post.province_select.value;
    } else {
        //alert('foo');
        document.customer_bill_add_post.province.value = document.customer_bill_add_post.province_input.value;
        }
});        


});

干杯，

选择并输入复制到一个输入中进行发布

1 个答案: