Sự kiện kích hoạt Jquery cho hộp kiểm

Question

Tôi đã chọn hộp kiểm, mà tôi đã viết kịch bản lệnh jquery khi nhấp. Khi người dùng nhấp vào hộp kiểm, nó sẽ mở ra một loạt các hộp kiểm và nó đi vào. Bây giờ vấn đề của tôi là khi người dùng kiểm tra vài trong số các hộp kiểm đó và chuyển sang trang tiếp theo và vì lý do nào đó, người đó quay lại trang hộp kiểm. Sau đó, tôi nên có tất cả các hộp mà anh/cô ấy đã kiểm tra để mở ra. Tôi đã viết một kiểm tra hộp kiểm tra khi tải 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(); 
    } 
    }); 
}); 

Như bạn thấy ở trên. Chính là lớp hộp kiểm. Khi nhấp vào đó, tôi sẽ mở một loạt hộp kiểm khác. Bây giờ tôi muốn điều này được thực hiện tự động cho các hộp đã chọn của họ khi họ truy cập lại trang

Answer 1

phiên sử dụng hoặc cookie để lưu các giá trị checkbox lớp .main và kiểm tra những cho phù hợp khi bạn trở lại và sau đó sử dụng đoạn mã sau:

<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> 

Answer 2

Thông thường trình duyệt quyết định "trợ giúp" và điền vào biểu mẫu mà người dùng đã hoàn thành. Bạn không nên dựa vào trình duyệt vì cài đặt có thể dễ dàng thay đổi và có thể khác với người dùng đối với người dùng.

Thay vào đó, bạn có thể muốn suy nghĩ về việc lưu trữ các hộp kiểm được nhấp trong cookie/localstorage hoặc có thể gửi mỗi nhấp chuột qua AJAX tới máy chủ của bạn. Sau đó, khi người dùng truy cập vào trang, bạn có thể kiểm tra nội dung của cookie hoặc truy xuất các phần tử được nhấp đã được lưu qua AJAX; Sau đó, bạn có thể tạo lại các nhấp chuột trên các phần tử thích hợp.

Ckeck ra bài này có liên quan để xử lý dữ liệu cookie với jQuery - How do I set/unset cookie with jQuery?

Answer 3

tôi chỉ cần sử dụng một số JSON và lưu trữ địa phương để theo dõi những gì hộp đã được kiểm tra, vv

$(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)); 
    }); 
}); 

DEMONSTRATION