2

Если перезагрузил страницу и сразу нажал на ВТОРОЙ ЗАЛ - фильтр показывает и 14 и 15 число сразу.

Как сделать, чтобы показывало то чисто и тот зал, которые выбраны, а не всё сразу при переключении на второй зал?

Но при этом, при перезагрузке страницы по умолчанию должно стоять также как сейчас стоит. Другими словами, проблема только с переключением на второй зал, сразу после перезагрузки.

На codepen.

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="radio" class="rad1" id="rad1">Первый зал
<input type="radio" class="rad1" id="rad2">Второй зал
<input type="radio" class="rad1" id="rad3">14
<input type="radio" class="rad1" id="rad4">15
<hr>
<div class="pq chet item">первый зал 14 число</div>
<div class="pq chet item">первый зал 14 число</div>
<div class="pq chet item">первый зал 14 число</div>
<div class="pq chet item">первый зал 14 число</div>


<div class="pq pyzt item">первый зал 15 число</div>
<div class="pq pyzt item">первый зал 15 число</div>
<div class="pq pyzt item">первый зал 15 число</div>

<div class="pw chet item">второй зал 14 число</div>
<div class="pw chet item">второй зал 14 число</div>

<div class="pw pyzt item">второй зал 15 число</div>
<div class="pw pyzt item">второй зал 15 число</div>
<div class="pw pyzt item">второй зал 15 число</div>

JS

jQuery(document).ready(function () {
        $('.item').hide();

        var val = [1];

  $('.pq.chet.item').show();
        $('#rad1').prop('checked', true);
        $('#rad3').prop('checked', true);
        $('#rad1').change(function () {
            if ($('#rad1').prop('checked', true)){
                $('#rad2').prop('checked', false);
                val[0] = 1;
            }
        });
        $('#rad2').change(function () {
            if ($('#rad2').prop('checked', true)){
                $('#rad1').prop('checked', false);
                val[0] = 2;
            }
        });
        $('#rad3').change(function () {
            if ($('#rad3').prop('checked', true)){
                $('#rad4').prop('checked', false);
                val[1] = 1;
            }
        });
        $('#rad4').change(function () {
            if ($('#rad4').prop('checked', true)){
                $('#rad3').prop('checked', false);
                val[1] = 2;
            }
        });
        $('.rad1').change(function () {
            $('.item').hide();
            if (val[1] == undefined){
                if (val[0] == 1){
                    $('.pq.chet.item').show();
                    $('.pq.pyzt.item').show();
                } else if (val[0] == 2){
                    $('.pw.chet.item').show();
                    $('.pw.pyzt.item').show();
                }
            } else {
                if (val[0] == 1){
                    if(val[1] == 1){
                        $('.pq.chet.item').show();
                    } else if (val[1] == 2){
                        $('.pq.pyzt.item').show();
                    }
                } else if (val[0] == 2){
                    if(val[1] == 1){
                        $('.pw.chet.item').show();
                    } else if (val[1] == 2){
                        $('.pw.pyzt.item').show();
                    }
                }
            }
        })

    });
0

1 ответ 1

2

    jQuery(document).ready(function () {
        $('.item').hide();

        var val = [1];
        val[1] = 1;

        $('.pq.chet.item').show();
        $('#rad1').prop('checked', true);
        $('#rad3').prop('checked', true);
        $('#rad1').change(function () {
            if ($('#rad1').prop('checked', true)){
                $('#rad2').prop('checked', false);
                val[0] = 1;
            }
        });
        $('#rad2').change(function () {
            if ($('#rad2').prop('checked', true)){
                $('#rad1').prop('checked', false);

                val[0] = 2;
            }

        });
        $('#rad3').change(function () {
            if ($('#rad3').prop('checked', true)){
                $('#rad4').prop('checked', false);
                val[1] = 1;
            }
        });
        $('#rad4').change(function () {
            if ($('#rad4').prop('checked', true)){
                $('#rad3').prop('checked', false);
                val[1] = 2;
            }
        });
        $('.rad1').change(function () {
            $('.item').hide();
            if (val[1] == undefined){
                if (val[0] == 1){
                    $('.pq.chet.item').show();
                    $('.pq.pyzt.item').show();
                } else if (val[0] == 2){
                    $('.pw.chet.item').show();
                    $('.pw.pyzt.item').show();
                }
            } else {
                if (val[0] == 1){
                    if(val[1] == 1){
                        $('.pq.chet.item').show();
                    } else if (val[1] == 2){
                        $('.pq.pyzt.item').show();
                    }
                } else if (val[0] == 2){
                    if(val[1] == 1){
                        $('.pw.chet.item').show();
                    } else if (val[1] == 2){
                        $('.pw.pyzt.item').show();
                    }
                }
            }
        })

    });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="radio" class="rad1" id="rad1">Первый зал
<input type="radio" class="rad1" id="rad2">Второй зал
<input type="radio" class="rad1" id="rad3">14
<input type="radio" class="rad1" id="rad4">15
<hr>
<div class="pq chet item">первый зал 14 число</div>
<div class="pq chet item">первый зал 14 число</div>
<div class="pq chet item">первый зал 14 число</div>
<div class="pq chet item">первый зал 14 число</div>


<div class="pq pyzt item">первый зал 15 число</div>
<div class="pq pyzt item">первый зал 15 число</div>
<div class="pq pyzt item">первый зал 15 число</div>

<div class="pw chet item">второй зал 14 число</div>
<div class="pw chet item">второй зал 14 число</div>

<div class="pw pyzt item">второй зал 15 число</div>
<div class="pw pyzt item">второй зал 15 число</div>
<div class="pw pyzt item">второй зал 15 число</div>

3
  • спасибо большое 15 фев 2020 в 9:32
  • теперь другой баг. Если после перезагрузки поставить 15 число а потом тыкнуть Второй зал, то выбираются все числа 15 фев 2020 в 9:52
  • @ЗюзинPLAY добавил изменения.
    – Denis640Kb
    15 фев 2020 в 12:06

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.