"35.172.217.40 - 35.172.217.40"

Событие триггера JQuery для флажка

У меня есть ряд флажков, для которых я написал jquery script при щелчке. Когда пользователь нажимает на флажок, он открывает еще одну серию флажков, и она продолжается. Теперь моя проблема в том, что пользователи проверяют некоторые из этих флажков и переходят на следующую страницу, и по какой-то причине он возвращается на страницу. Тогда у меня должны быть все ящики, которые он/она проверил, чтобы открыть. Я написал проверку флажка, когда dom загружает

$(document).ready(function(){
   if($('.main').is(':checked')){
      $(this).trigger('click'); 
   }else{
      //do  nothing
   }

  $('.main').click(function(){
      if($('.main').is(':checked')){
       var val = $(this).attr('alt');
       $('#'+val).show();
   }else{
       var val = $(this).attr('alt');
       $('#'+val).hide();
   }
  });
});

Как вы видите выше. Главная - это класс флажка. После этого я открываю еще одну серию флажков. Теперь я хочу, чтобы это автоматически выполнялось для их отмеченных ящиков, когда они снова посещают страницу.

+6
источник поделиться
3 ответа

используйте сеанс или файл cookie, чтобы сохранить значения флажка класса .main и соответствующим образом проверили их при возврате, а затем используйте следующий код:

<script type="text/javascript">
$(document).ready(function(){

   $('.main').each(function(){
      if($(this).is(':checked')){
        var val = $(this).attr('alt');
        $('#'+val).show();
      }else{
        var val = $(this).attr('alt');
        $('#'+val).hide();
       }
     });


   if($('.main').is(':checked')){
      $(this).trigger('click'); 
   }else{
      //do  nothing
   }

  $('.main').click(function(){
      if($('.main').is(':checked')){
       var val = $(this).attr('alt');
       $('#'+val).show();
   }else{
       var val = $(this).attr('alt');
       $('#'+val).hide();
   }
  });
});
</script>
+3
источник

Я бы просто использовал JSON и локальное хранилище, чтобы отслеживать, какие поля были проверены и т.д.

$(document).ready(function () {
    if (localStorage.getItem('boxes')) {
        var boxes = JSON.parse(localStorage.getItem('boxes'));
        $.each(boxes, function (idx, val) {
            var box = $('.main').eq(idx);
            box.prop('checked', val);
            $('#' + box.attr('alt')).toggle(val);
        });
    }

    $('.main').on('change', function () {
        var val = $(this).attr('alt'),
            boxes = {};

        $.each($('.main'), function (i, el) {
            boxes[$(el).index('.main')] = el.checked;
        });

        $('#' + val).toggle(this.checked);
        localStorage.setItem('boxes', JSON.stringify(boxes));
    });
});

ДЕМОНСТРАЦИЯ

+1
источник

Обычно это браузер, который решает "помочь" и пополнить формы, которые пользователь уже выполнил. Вы не должны полагаться на браузер, так как этот параметр можно легко изменить и может отличаться от пользователя к пользователю.

Вместо этого вы можете подумать о сохранении отмеченных флажков в файле cookie/localstorage или, возможно, отправив каждый клик через AJAX на ваш сервер. Затем, когда пользователь приземляется на странице, вы можете проверить содержимое своего файла cookie или загрузить элементы, которые были сохранены через AJAX; Затем вы можете воссоздать клики по соответствующим элементам.

Выделите этот связанный пост для обработки файлов cookie с помощью jQuery - Как установить/удалить файл cookie с помощью jQuery?

0
источник

Посмотрите другие вопросы по меткам или Задайте вопрос