Skip to content

Instantly share code, notes, and snippets.

@JoshuaFrontEnd
Last active August 28, 2020 05:29
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save JoshuaFrontEnd/46cfd29bf8a8d3a41fe56d8a34776d82 to your computer and use it in GitHub Desktop.
Save JoshuaFrontEnd/46cfd29bf8a8d3a41fe56d8a34776d82 to your computer and use it in GitHub Desktop.
Una lista de snippets en jquery
// Suma de multiples inputs al hacer keyup usando solo una clase, convirtiendo enteros a decimales
$('.inputAsumar').on('keyup', function(){
var total = 0;
$('.inputAsumar').each( function(){
//Convirtiendo valor a numero
total += Number($(this).val());
});
//Convirtiendo numero a entero
console.log(parseInt(total));
//Alternativamente mostrar resultado en otro input
$('.mostrarResultado').val(parseInt(total));
});
//Capturar el evento resize con un setTimeout, util para aplicar transiciones CSS
var resizeId;
$window.resize(function() {
clearTimeout(resizeId);
resizeId = setTimeout(doneResizing, 1);
});
//Calcular el ancho de la ventana, ligado a la funcion anterior calcula el ancho de forma inmediata al hacer resize
function doneResizing(){
var $anchoVentana = $window.outerWidth();
if( $anchoVentana >= 1200 ){
//Aplicar funcion
}
return $anchoVentana;
}
// Seteo de eventos dependiendo de la resolucion
(function (window, document, undefined) {
'use strict';
var mediaQuery = window.matchMedia('(min-width: 1200px)');
mediaQuery.addListener(doSomething);
function doSomething(mediaQuery) {
if (mediaQuery.matches) {
// console.log('desktop');
} else {
//console.log('mobile');
}
}
// On load
doSomething(mediaQuery);
})(window, document);
// Click toogle
$('.elementOnclick').on('click', function(e) {
e.preventDefault();
var $this = $(this);
if ($this.attr('data-click-state') == 1) {
$this.attr('data-click-state', 0);
console.log('click two');
} else {
$this.attr('data-click-state', 1);
console.log('click one');
}
};
// click Toogle vanilla
const inputPassword = document.querySelectorAll(".wb_togglepassword");
for (let i = 0; i < formInputs.length; i++) {
inputPassword[i].addEventListener("click", function() {
let $this = this;
if ( $this.getAttribute('data-click-state') == 1 ) {
$this.setAttribute('data-click-state', 0);
console.log('click two');
} else {
$this.setAttribute('data-click-state', 1);
console.log('click one');
}
})
}
// Evento solo en el padre, modificar el target para quitar la propagacion de algun hijo en especifico con e.target.classname
// If the e.target is the same element as this, you've not clicked on a descendant.
$('.foobar').on('click', function(e) {
if (e.target !== this)
return;
alert( 'clicked the foobar' );
});
//Detectar cuando un elemento pierde el foco haciendo click afuera de el, en el documento (ORDENAR, revisar dashboard.html desarrollo BCARE WOM)
$(document).on("click", function(e){
var $trigger = $(".dropdown");
if($trigger !== e.target && !$trigger.has(e.target).length){
console.log('perdi el foco');
}
});
//Hover
$(".selector").on({
mouseenter: function () {
//stuff to do on mouse enter
},
mouseleave: function () {
//stuff to do on mouse leave
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment