1

我试图select-boxes通过在从第一个选择一个选项后启用第二个选择框来设置两个工作。

结果来自一个带有 js 的 json 到我页面上的一个 div。

第二个选择设置为disabled

第一次尝试：

JavaScript：

$(document).ready(function () {
    $.getJSON('./system/feeds/built.search.php', function (json) {
        var output = '';
        output += '<div class="search_block">';
        output += '<h2><img src="images/search_icon_big.png" alt=""> Search used cars</h2>';
        output += '<form id="form1" class="form-style" method="post">';
        output += '<label><strong>Company</strong><br>';
        output += '<span class="select1">';
        output += '<select name="companies" id="companies">';
        output += '<option>All</option>';
        output += '<option value="company">Company</option>';
        for (var i = 0; i < json.company_models.length; i++) {
            output += '<option value=' + json.company_models[i].company + '>' + json.company_models[i].company + '</option>';
        }
        output += '</select>';
        output += '</span>';
        output += '</label>';
        output += '<label><strong>Model</strong><br>';
        output += '<span class="select1">';
        output += '<select name="models" id="models" disabled>';
        output += '<option>Choose Company</option>';
        $('#companies').change(function () {
            if (this.value) {
                document.getElementById('#models').disabled = true;
            } else {
                document.getElementById('#models').disabled = false;
            }
        });
        for (i = 0; i < json.company_models.length; i++) {
            output += '<option value=' + json.company_models[i].model + '>' + json.company_models[i].model + '</option>';
        }
        output += '</select>';
        output += '</span>';
        output += '</label>';
        $('#search').html(output);
    });
});

HTML：

<div id="search" class="grid_12"></div>

jsfiddle.net/mJdmQ

为了使它更容易：

Company | Model：要从模型中选择选项，我必须首先从公司中选择一个选项

PS：为了节省您提及类似问题的时间，我已经看过它们......

4

1 回答 1

1

您正在寻找.change()带有 jQ​​uery 的事件（onchange在纯 js 中），由于这是动态加载的数据，您需要使用.on()：

$(document).on("change", "#companies", function() {
    this.value == "All" ? $("#models").prop("disabled", true) : $("#models").prop("disabled", false);
});
于 2013-09-16T23:07:30.173 回答