jquery
To jest stara wersja strony!
Spis treści
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 odtworzenie stanu collapse card
<div class="card">
<div class="card-header nag" id="coll_1">
<span class="ico"><i class="fas fa-chevron-down"></i></span>...
</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.1714894171.txt.gz · ostatnio zmienione: 2024/09/15 16:22 (edycja zewnętrzna)