下拉列表不起作用?

时间:2013-09-25 12:27:19

标签: javascript jquery html forms

我希望根据以前的选择创建一个下拉列表,我尝试在这里创建一个[小提琴]((http://jsfiddle.net/KarinaMcG/krn32/1/),但我的第二个下拉列表没有填充。我缺少/做什么错?

HTML

<div>System Selector:
    <select class="systemDropDown">
        <option value="">--Select System--</option>
        <option value="Demandware">Demandware</option>
        <option value="Site Replication">Site Replication</option>
        <option value="3rd Party Request">3rd Party Request</option>
        <option value="Log-in (all others)">Log-in (all others)</option>
        <option value="Log-in (Global Collect)">Log-in (Global Collect)</option>
        <option value="Global Collect Issue">Global Collect Issue</option>
        <option value="Store Locator">Store Locator</option>
        <option value="New Product Request">New Product Request</option>
        <option value="Other">Other</option>
    </select>
</div>
<div>Country:
    <select class="countryDropDown">
        <option value="">--Select Country--</option>
    </select>
</div>

的Javascript

jQuery(document).ready(function ($) {

    $(".systemDropDown").change(function () {
        var system = $(this).val();

        function fillcountryDropDown(systemCountryOption) {
            $.each(systemCountryOption, function (val, text) {
                $('.countryDropDown').append(
                $('<option></option>').val(val).html(text));
            });
        }

        function clearCountryDropDown() {
            $('.countryDropDown option:gt(0)').remove();
        }
        if (system == 'Demandware') {
            clearCountryDropDown();

            var demandwareCountryOption = {

                SPAIN: 'Spain',
                IRELAND: 'Ireland',
                USA: 'Usa'
            };

            fillCountryDropDown(demandwareCountryOption);
        } else if (system == 'Site Replication') {
            clearCountryDropDown();
            var sitereplicationCountryOption = {

                LONDON: 'London',
                LIVERPOOL: 'Liverpool',
                DERBY: 'Derby'
            };
            fillCountryDropDown(sitereplicationCountryOption);
        }
        var countryOptions = {
            val1: 'text1',
            val2: 'text2'
        };

    });

});

2 个答案:

答案 0 :(得分:3)

JavaScript区分大小写。

您可以在此处定义一个函数:

function fillcountryDropDown(systemCountryOption)
{
    // implementation
}

并在此处致电:

fillCountryDropDown(demandwareCountryOption);

将定义更改为fillCountryDropDown,jsFiddle似乎在此处起作用。 (还要选择要加载的jQuery,我确定你在页面上做了但忘记了jsFiddle。)

答案 1 :(得分:1)

你不会喜欢这个!

Javascript区分大小写......

未调用您的函数fillcountryDropDown。您需要将函数名称更改为fillCountryDropDown