Juan Manuel
11 de Enero de 2010 a las 11.00
Si te sirvieron los snippets de javascript y jQuery que posteé anteriormente, aquà tienes una segunda entrega para ahorrar tiempo en tus desarrollos en el frontend.
Esta vez con snippets para chequear cookies, tildar/destildar varios checkboxes, validar una fecha de nacimiento, centrar elementos en la pantalla, obtener urls y saber si el usuario presiona una tecla en especial.
Chequear si las cookies están activadas:
-
$(document).ready(function() {
-
var dt = new Date();
-
dt.setSeconds(dt.getSeconds() + 60);
-
document.cookie = "cookietest=1; expires=" + dt.toGMTString();
-
var cookiesActivadas = document.cookie.indexOf("cookietest=") != -1;
-
if(!cookiesActivadas){
-
//las cookies no están activadas
-
}
-
});
Tildar/destildar una serie de checkboxes:
-
var tog = false; // o true si vienen con tildadas por default
-
$('a').click(function() {
-
$("input[type=checkbox]").attr("checked",!tog);
-
tog = !tog;
-
});
Obtener el Ãndice de un elemento:
-
$("ul> li").click(function () {
-
var index = $(this).prevAll().length;
-
});
Validar fecha de nacimiento:
-
$("#lda-form").submit(function(){
-
var dia = $("#dia").val();
-
var mes = $("#mes").val();
-
var anio = $("#anio").val();
-
var edad = 18;
-
var miFecha = new Date();
-
miFecha.setFullYear(anio, mes-1, dia);
-
-
var fechaActual = new Date();
-
fechaActual.setFullYear(fechaActual.getFullYear() - edad);
-
if ((fechaActual - miFecha) <0){
-
alert("Disculpa, sólo personas de más de " + edad + " pueden ingresar a este sitio.");
-
return false;
-
}
-
return true;
-
});
Chequear si un elemento es visible:
-
if($(element).is(":visible") == "true") {
-
//El elemento es visible
-
}
Contar los hijos de un elemento:
-
<div id="foo">
-
<div id="bar"></div>
-
<div id="baz">
-
<div id="biz">
-
</div>
-
<span><span>
-
</div>
-
-
//codigo jQuery para contar elementos hijos
-
$("#foo> div").length
Centrar un elemento en la pantalla:
-
jQuery.fn.center = function () {
-
this.css("position","absolute");
-
this.css("top", ( $(window).height() - this.height() ) / 2+$(window).scrollTop() + "px");
-
this.css("left", ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + "px");
-
return this;
-
}
-
-
//Usar la función asÃ:
-
$(element).center();
Mover las opciones de una lista A a una lista B:
-
$().ready(function() {
-
$('#add').click(function() {
-
!$('#select1 option:selected').appendTo('#select2');
-
});
-
$('#remove').click(function() {
-
!$('#select2 option:selected').appendTo('#select1');
-
});
-
});
Seleccionar todos los checkboxes de una sola vez:
-
$(document).ready(function(){
-
$("#checkboxall").change(function(){
-
var checked_status = this.checked;
-
$("input[name=checkall]").attr("checked", checked_status);
-
});
-
-
});
Obtener la url actual:
-
$(document).ready(function() {
-
var pathname = window.location.pathname;
-
});
Saber si se presionó una tecla y cuál:
-
$(function() {
-
$(document).keypress(function(e){
-
switch(e.which){
-
// "ENTER"
-
case 13:
-
alert('Se presionó Enter');
-
break;
-
-
// "s"
-
case 115:
-
alert('Se presionó S');
-
break;
-
-
//(etc...)
-
-
}
-
});
-
-
});
¿Conoces alguna forma mejor de llevar a cabo alguna de las tareas de estos snippets? ¡Compártela con nosotros!
Fuente: Codrop
Lunes, 11 de Enero de 2010 a las 21.39
El ultimo codigo "Saber si se presionó una tecla y cuál:" no funciona como un keylogeer? es mi pregunta.
Martes, 12 de Enero de 2010 a las 01.21
Que pena das estos mismos artÃculos los sacas de http://tympanus.net/codrops/ que acaso no puedes generar tu propio contenido y tienes que copiarlo a los demás??
Martes, 12 de Enero de 2010 a las 11.54
@Roy
¿Acaso no has visto que se cita la fuente al pie del artÃculo?
Por otra parte, para los que quieran aprender pero no entiendan inglés, he TRADUCIDO todos los comentarios del código y he usado VARIABLES EN ESPAÑOL.
Eso lleva mucho trabajo y, si a tà no te ha sido de utilidad, a muchos otros estoy seguro que sÃ.
Lo que da pena es que hayas tomado una postura tan agresiva. Espero que mi respuesta te haga recapacitar.
Te envÃo saludos.
Martes, 12 de Enero de 2010 a las 11.59
@kzok
Pues se puede utilizar con ese fin... pero habrÃa que guardar la info registrada en algún lado, ya sea en una cookie o por backend, ya en un mail, db, etc...
La aplicación más común son las webapps que te permiten controlarlas con el teclado (ej: usar photoshop online, donde podemos teclear "V" para seleccionar la herramienta "Mover").
Cualquier otra duda vuelve a preguntar =)
Jueves, 11 de Febrero de 2010 a las 18.19
hola me parece genial estos snippets, pero me gustaria saber como hacer para postear codigo como tu has echo, sin que pierda formato ni nada.
Lunes, 15 de Febrero de 2010 a las 18.46
Usamos un plugin para WordPress que se llama iG:Syntax Hiliter
Este plugin permite pegar directamente el código que quieras, aunque tiene algunas limitaciones.
Viernes, 11 de Junio de 2010 a las 19.04
Varios de esos scripts estan mal u___u ....
ejemplo:
if($(element).is(":visible") == "true") {
//El elemento es visible
}
simplemente deberia ser
if($(element).is(":visible"))
o
if($("element:visible"))