Detectar copiar, pegar y cortar en una caja de texto con jQuery

ByLuis

Algo sencillo que no conocía y que nos permite detectar cuando se copia, corta y pega en cajas de texto usando jQuery.

$(document).ready(function() {
$("input:text").bind('copy', function(e) {
alert('Copiando...');
});
$("input:text").bind('paste', function(e) {
alert('Pegando...');
});
$("input:text").bind('cut', function(e) {
alert('Cortando...');
});
});

Detect Copy, Paste and Cut operations on a TextBox using jQuery

Vía / Script & Style

Similar Posts

WireIt: librería Javascript para crear ‘cables’

ByLuis

WireIt es una librería basada en Yahoo Pipes que nos permite crear cables y conectar con ellos elementos. Sí, algo difícil de entender, pero si decimos que es perfecto para crear diagramas o si símplemente vemos la imagen, nos haremos una idea de cuál es su funcionalidad.
wireit.png
Está montada sobre Yahoo! User Interface y nos permite mover objetos, conectarlos entre sí, desconectarlos y mucho más.
WireIt
Gracias Elías por el aviso

Flashing de elementos con Mootools

ByLuis

Una librería para MooTools que permite realizar flash en los elementos. Permite indicar el color de origen, final, el número de repeticiones y el tiempo del efecto y la posibilidad de incluir propiedades al elemento (por ejemplo backgroud-color).

Su uso es sencillo y nos ofrece ejemplos de cómo utilizarlo:

/* flash on click */
$('flash-link').addEvent('click', function () {
$('flash-me').flash('#fff','#fffea1',5,'background-color',500);
});
/* flash on ajax complete */
$('flash-link-ajax').addEvent('click', function () {
//make the ajax call
var req = new Request({
method: 'get',
url: 'element-flashing.php',
data: { 'do' : '1' },
onRequest: function() {  },
onComplete: function(response) {
$('flash-me-ajax').set('text', response).flash('#fff','#fffea1',5,'background-color',500);
}
}).send();
});
/* flash on scroll completion */
$('flash-link-scroll').addEvent('click', function() {
var scroller = new Fx.Scroll(window, {
onComplete: function() {
$('scroll-to-me').flash('#fff','#fffea1',10);
}
}).toElement('scroll-to-me');
});

Eso sí, no olvidar que no hay que abusar de este efecto.

MooTools Gone Wild: Element Flashing

Vía / CSS Globe

Memory leaks en Javascript

ByLuis

Mirando una entrada sobre cómo evitar que se puedan producir pérdidas de memoria en Javascript, me he encontrado con una extensión para Firefox que te avisa cuando se produce este tipo de situaciones.
memoryleak.png

De paso, comentaré los tres consejos que nos da para evitar esas perdidas de memoria, que nunca vienen mal.

  • Pon la propiedad onreadystatechange a null del objeto XMLHttpRequest cuando hayas acabado de usarlo.
  • Limpia los eventos en el unload si hay posibilidad de que hagan referencia a objetos DOM.
  • No asignes nada más que valores primitivos (string, int, …) en las propiedades del DOM aunque vayas a limpiarlo después.

La verdad es que estos problemas no me queda muy claro si se dan solo en Firefox o en otro navegador, aún así, buenas costumbres a la hora de programar siempre son bienvenidas.

Leak Monitor

3 Easy Steps to Avoid JavaScript Memory Leaks

Vía / Digg

Spinbox mediante Javascript

ByLuis

SpinBox.JS es un script no obstrusivo que permite añadir botones para aumentar y disminuir el valor de una caja de texto.
spinbox.png
Permite inhabilitar alguno de los botones para no permitir aumentar o disminuir (o ambos) y su uso es muy sencillo, tan solo hay que añadir una función que modifica los inputs.
Por si te interesa, también puedes visitar otro script parecido que mencioné hace tiempo, o incluso uno que hice yo.
SpinBox.JS
Vía / CSS Globe

Popcorn.js librería Javascript que permite sincronizar vídeo y contenido en HTML5

ByLuis

Popcorn.js es una librería que permite sincronizar la etiqueta <video> de HTML5 con contenido que deseemos mostrar. Para ello utiliza las propiedades, métodos y eventos nativos de HTMLMediaElement. Además ofrece un sistema de plugins desarrollados por la comunidad:

document.addEventListener("DOMContentLoaded", function () {
      // Create a popcporn instance by calling Popcorn("#id-of-my-video")
      var pop = Popcorn("#video");
      // play the video right away
      pop.play()
      // add a footnote at 2 seconds
        .footnote({
          start: 2,
          end: 6,
          text: "This footnote is the stepping stone of progress!",
          target: "footnotediv"
        });
    }, false);

Podéis ver algunos ejemplos bastante interesantes. Una librería muy útil para presentaciones y vídeos corporativos.

Popcorn.js

One Comment

  1. Hola, me ha servido mucho tu publicación, pero tengo una duda, como evito que un usuario, arrastre y coloque un texto desde alguna parte del sitio o inclusive de un texto en word o en otro programa?

Comments are closed.