Narzędzia użytkownika

Narzędzia witryny


jquery

To jest stara wersja strony!


jQuery

Zapamietanie i odtworzenie stanu scroll strony

$('html').scrollTop(window.localStorage.getItem('scroll')); 
$(window).scroll(function(){
    var scrollPos = $(document).scrollTop();
    window.localStorage.setItem('scroll',scrollPos);
}); 

Formularz - submit bez odświeżania strony JS

$('#form').on('submit', function (e) {
    var dataString = $(this).serialize();
    $.ajax({
      type: 'POST',
      url: '/create',
      data: dataString,
      success: function () {
        $('#tresc').load('/view?id=10');
      }
    });
    e.preventDefault();
});

Ajax - Proszę czekać

Wyświetlanie elementu #wait przed załadowaniem strony metodą ajax i ukrywanie po załadowaniu

   $.ajax({
        beforeSend: function(){
            $('#wait').show();
        },
        complete: function(){
            $('#wait').hide();
            }
   });

Bootstap4 card toggle

Kliknięcie w card-header ukrywa bądź odkrywa card-body

Widok

<div class="card">
    <div class="card-header nag">
        ...
    </div>
    <div class="card-body bod">
        ...                
    </div>
</div>
<?php
$this->registerJs(<<<JS
   $('.bod').hide();
   $('.nag').on('click',function(){
        $(this).next().toggle();
        }
       )     
JS
);

Zapamiętanie i odtwoeznie stanu collapse card

<div class="card">
  <div class="card-header nag" id="coll_1">
    <i class="fas fa-chevron-down"></i>...
  </div>
  <div class="card-body bod">
  ...
  </div>
</div>


$('.bod').hide();
idc = window.localStorage.getItem('coll');
$('#'+ idc).next().show();
$('.nag').on('click', function () {
    id = this.id;  
    cont = $(this).next();
    cont.toggle();
    if (!cont.is(':hidden')) {
        $(this).find('.ico').html('<i class="fas fa-chevron-up"></i>');
        window.localStorage.setItem('coll',id);  
    } else {
        $(this).find('.ico').html('<i class="fas fa-chevron-down"></i>');
        window.localStorage.setItem('coll',''); 
    }
}
 

Zapamiętanie stanu collapse BS4

$('.collapse').on('hidden.bs.collapse', function() {
    localStorage.setItem('coll_' + this.id, false);
});

$('.collapse').on('shown.bs.collapse', function() {
    localStorage.setItem('coll_' + this.id, true);
});

$('.collapse').each(function() {
    if (localStorage.getItem('coll_' + this.id) == 'true') {
      $(this).collapse('show');
    }
});

Copy przez kliknięcie lewym przyciskiem

 <p class="cpc">tekst do schowka</p>
 
<?php
$this->registerJs('
        function ctc(element) {
            var $temp = $("<input>");
            $("body").append($temp);
            $temp.val($(element).text()).select();
            document.execCommand("copy");
            $temp.remove();
          }
    ');
$this->registerJs("
        $('.cpc').on('click',function(){
            ctc(this);
        })
    ");
$this->registerCss('
        .cpc{
            cursor:url(/img/copy.png) 4 12, copy;
            font-family:"Lucida Console", Monaco, monospace;
        }
    ');
jquery.1669488538.txt.gz · ostatnio zmienione: 2024/09/15 16:22 (edycja zewnętrzna)