Archive for category: javascript

03Nov 2009 2 Comments

Como poner link agregar a favoritos

Categories: html, javascript - Tags: ,

Muchos usuario o no tienen idea o les da un poco de flojera poner nuestro sitio en su lista de favoritos, asi que podemos hacerselo más fácil y de pasada ganar un nuevo visitante con un link que agregue nuestro sitio a los favoritos.

Este script funciona directamente en Internet Explorer pero en Firefox mostrará un mensaje con la tecla rápida para hacerlo.

La función javascript para esto la pegas dentro de las etiquetas head de tu sitio

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<script type="text/javascript">
function agregar(){
//Para internet explorer
if ((navigator.appName=="Microsoft Internet Explorer") && (parseInt(navigator.appVersion)>=4)) {
var url="http://www.tudireccion.com/"; //Aqui la direccion de tu web
var titulo="El nombre de mi web"; //Aqui el nombre de tu web
window.external.AddFavorite(url,titulo);
}
//Para Firefox
else {
if(navigator.appName == "Netscape")
alert ("Presione Crtl+D para agregar a este sitio en sus Favoritos");  //Aqui el mensaje que desees para Firefox
}
}
</script>

Y el link en tu página web sería

1
<a href="javascript:agregar()">Agregame a tus favoritos</a>
10Oct 2009 21 Comments

Agregar campos usando AJAX jquery

Categories: AJAX, javascript - Tags: , ,

Seguro hemos visto algunas páginas ajax en las que piden por ejemplo correo luego podemos apretar un botón “añadir” y se agrega un campo más para insertar un nuevo correo y asi cuantos deseemos; también hay algunos más complicados en los que puedes añadir por ejemplo detalles de tu experiencia laboral en un curriculum.

La idea es los casos mencionados es exactamente la misma (campos mas, campos menos) por cuestión de espacio y tiempo explicaré como funciona la más sencilla para ello debemos tener claros algunos conceptos previos.

Arrays de controles HTML

Como no sabemos cuantos campos quiera añadir el usuario, debemos estar preparados para recibir cualquier cantidad de datos por lo cual vamos a usar un array de controles como este:

1
<input type="text" size="20" name="email[]">

Lo unico distinto con cualquier otro control es que al final del nombre uso unos corchetes.

Manejando arrays de controles con PHP

Normalmente en PHP los campos recibidos llegan con POST o GET según corresponda y podemos manejarlo directamente pero con los arrays se manejan un poco distinto, algo así:

1
2
3
4
5
6
<?php
$emails=$_POST['email'];
for ($i=0; $i<=count($emails); $i++) {
    echo $emails[$i].'<br>';
}
?>

¿Cómo agregar campos?

Para esto voy a usar un link que invoque a una funcion javascript que agrega el campo adicional

1
<a href="#" onclick="agregar();">Agregar</a>

La función usando jquery es muy sencilla basta usar “attend” para que al final agregue un campo adicional

1
2
3
4
5
6
<script type="text/javascript">
function agregar() {
    campo = '<li><label>Email:</label><input type="text" size="20" name="email[]" /></li>';
    $("#emails").append(campo);
}
</script>

El tema de la presentación o de usar alguna imagen ya depende de nuestra hoja de estilos aunque en este ejemplo he usado un sólo campo es posible usando el mismo código para añadir bloques completos de campos.

Ver demo   Descargar

——– Actualización ——-
Varios lectores me preguntaban como hago para borrar los campos ingresado, eso lo ven AQUI

24Sep 2009 0 Comments

javascript redirigir actualizar pasado un tiempo

Categories: html, javascript - Tags: ,

Muchas veces requerimos que una página se redirija a otra automáticamente por ejemplo para mostrar mensajes del tipo “esta página no esta disponible”, “estamos en mantenimiento”, “hemos cambiado a la siguiente direccion, por favor espere unos segundos para ser redirigido”, etc.

Es muy fácil crear este tipo de mensajes, primero debemos hacer que se llame al cargar la página web, para eso usamos un código como este:

1
<body onLoad="redireccionar()">

Y ahora faltaría crear la función que redirija nuestra página web, que sería algo como esto en nuestro encabezado:

1
2
3
4
5
<script language="JavaScript">
  function redireccionar() {
    setTimeout("location.href='http://www.miweb.com'", 5000);
  }
  </script>

El comando setTimeout nos permite que transcurrido un tiempo, en este caso 5000 milisegundos (5 segundos) se produzca la redirección.

Actualización automática de la página

En este caso vamos a usar otro comando dentro del setTimeout

1
setTimeout('document.location.reload()',10000);

En este caso se actualizará automáticamente cada 10 segundos

Regresar a la página anterior

Si quisieramos mostrar un mensaje y que luego se dirija a la página anterior sería

1
setTimeout('history.back()',10000);

Suscribete

Ahora también puedes suscribirte via correo electrónico

Ingresa tu dirección de correo:

Delivered by FeedBurner


Facebook

Mi Galeria flickr

[ Ver más ]

© Copyright - Miguel Manchego - Design by Kriesi