javascript - 链式选择仅显示第二个框(如果可以填充)

Question

我有一个链式选择，它工作正常，但并非 SELECT 1 中的所有值都会产生 SELECT 2 中的值，因此我想隐藏 SELECT 2 ，除非它有东西要显示。

我将其用于我的 JS:

<script type="text/javascript">
    $(document).ready(function() {
        $(".select1").change(function() {
            var id=$(this).val();
            var dataString = 'id='+ id;
            $.ajax ({
                type: "POST",
                url: "ajax_load.php",
                data: dataString,
                cache: false,
                success: function(html) {
                    $(".select2").html(html);
                } 
            });
        });
    });
</script>

然后我将第二个选择设置为 display:none 那么我怎样才能使第二个选择根据框 1 中的值出现和消失？

谢谢

Answer 1

试试这个:

<script type="text/javascript">
    $(document).ready(function () {
        $(".select2").hide();
        $(".select1").change(function () {
            var id = $(this).val();
            var dataString = 'id=' + id;
            $.ajax({
                type: "POST",
                url: "ajax_load.php",
                data: dataString,
                cache: false,
                beforeSend: function () {
                    $(".select2").hide();
                }
                success: function (html) {
                    $(".select2").show();
                    $(".select2").html(html);
                   var length = $('.select2 > option').length;
                   if(length>0){
                       $(".select2").show();
                   }else{
                       $(".select2").hide();
                   } 
                }
            });
        });
    });
</script>