Question

我正在jQuery中构建搜索功能。我有3个从MySQL数据库加载的下拉列表。当用户选择其中一个下拉列表时，它必须影响其他下拉列表值。

我让它为单独的值工作但是当他们选择2或3个下拉列表时我被卡住了。我和＆amp;＆amp;＆amp;运算符，但这不起作用。有人可以看看我做错了吗？

<script type="text/javascript">
    $(document).ready(function() {
    if( $(("#IndID").change) && $(("#CatID").change)) {
    $("#ProdName").load("scriptp.php?c3=" + $("#IndID").val() + $("#CatID").val());
    }

        if( $(("#IndID").change) && $(("#ProdName").change)) {
        $("#CatID").load("scriptc.php?c=" + $("#IndID").val() + $("#ProdName").val());
    }

        $("#IndID").change(function() {
        $("#CatID").load("scripti.php?c=" + $("#IndID").val());
        });

        $("#CatID").change(function() {
            $("#ProdName").load("script.php?cc=" + $("#CatID").val());
        });

    });
</script>

Answer 1

这样的事情：

$(document).ready(function() {

    // query already the elements you're going to use
    var $ind = $("#IndID"),
        $cat = $("#CatID"),
        $prod = $("#ProdName");

    $ind.change(function(e) {
        // populate the second select
        if ($(this).val() === "") {
            $cat.html('');
        } else {
            $cat.load("scripti.php?c=" + $ind.val());
        }
        // reset the third select
        $prod.html('');
    });

    $cat.change(function(e) {
        // populate the third select
        if ($(this).val() === "") {
            $prod.html('');
        } else {
            $prod.load("scriptc.php?c=" + $ind.val() + $cat.val());
        }
    });

});

注意：查询dom 效率不高所以最好先查询一下你的静态元素并使用jquery对象来处理，而不是重新查询所有的时间。

<强> DEMO

搜索功能的条件JQuery下拉列表

1 个答案: