2

我真的需要帮助。我是新手jQuery,我正在尝试dropdown list在选择列表中的选项时刷新或更改其值。

HTML

<select name="State_locate" class="State">
    <option value=" " selected="selected">Select a state</option>
    <option value="AL">Alabama</option>
    <option value="AK">Alaska</option>
</select>
<div id="City_1" class="Alabama">
    <select name="City_location[]" class="CityExt">
        <option value="Null" selected="selected">Select a city</option>
        <option value="Avondale">Avondale</option>
        <option value="Buckeye">Buckeye</option>
        <option value="Catalina">Catalina</option>
    </select>
</div>
<div id="City_1" class="Alaska">
    <select name="City_location[]" class="CityExt">
        <option value="Null" selected="selected">Select a city</option>
        <option value="Lancaster">Lancaster</option>
        <option value="Soth">Soth</option>
        <option value="Foothills">Foothills</option>
    </select>
</div>

JS

// JavaScript Document

$("select").bind("change", function () {

    if ($(this).val() == "AL") {
        $(".Alabama").slideDown();

        $(".Alaska").slideUp(function () {

            if ($('.Alabama').is(':visible')) {
                $(".Alaska option[value='Lancaster']").attr('selected', 'selected')
            }
        });
    } else if ($(this).val() == "AK") {
        $(".Alaska").slideDown();
        $(".Alabama").slideUp();
    }
})

我想做的是当一个州被选中时,一个城市就会下降。这完美无缺。但是一旦提交,城市的值就会存储在数组中City_location[]

遇到的问题是,如果用户为阿拉斯加选择了一个城市,然后在提交表单之前选择了阿拉巴马州下的另一个城市,那么您最终会在数组中得到阿拉巴马州和阿拉斯加州下的两个城市。

如果选择了阿拉巴马州,我正在寻找一种方法来为阿拉斯加州选择值“Null”。但是我的代码不起作用。它仅在值不是“Null”时才有效。例如,如果我在这部分jQuery代码中使用值“Lancaster”

$(".Alaska option[value='Lancaster']").attr('selected', 'selected')

它只工作一次。如果我做了两次,它不会更新。我怎么解决这个问题。

抱歉,代码太长了。谢谢您的帮助。

4

3 回答 3

0

我发现了我的问题。我没有使用“prop”,而是使用了“attr”

$(".Alaska option[value='Lancaster']").prop('selected', 'selected');

现在每次在提交两次以上之前选择另一个城市时,代码不仅可以使用一次。

我查了含义,但还是不太明白,为什么在 jquery 中使用“prop”而不是“attr”。我会继续搜索。我感谢所有回复我的人给我的所有帮助。

于 2013-10-20T19:34:58.610 回答
0

试试这个:

$(".Alaska option:eq(0)").attr('selected', 'selected')

由于 null 元素是第一个元素,这将解决您的问题。

于 2013-10-20T05:04:12.657 回答
0

你可以这样做:

$('.state').on('change',function() {
   $('.CityExt').val('');
}

然后,无论何时更改状态选择,它都会将两个城市选择的值设置为空。

于 2013-10-20T04:59:10.440 回答