¿Convertir JavaScript en marcador o bookmarklet?

3

He creado una secuencia de comandos que muestra las contraseñas al pasar, al igual que Windows 8 en el clic del ojo.

He hecho esta funcionalidad a través de JavaScript con el siguiente código.

function text(){this.type="text"}function password(){this.type="password"}function addHandlers(){var e=false;var t=document.evaluate("//input[@type='password']",document,null,6,null);for(var n=t.snapshotLength-1,r;r=t.snapshotItem(n);n--){if(!e){r.addEventListener("mouseover",text,false);r.addEventListener("mouseout",password,false)}else{r.addEventListener("focus",text,false);r.addEventListener("blur",password,false)}}}addHandlers()

Lo siento por el código JavaScript empaquetado, pero quiero crear un marcador o marcador que ejecute este script ...

Lo intenté:

javascript:(mycode);

Pero no funcionó ...

vishal
fuente
El marcador no es muy específico. Hay más de un programa que sabe algo como un marcador / bookmarklet. Por supuesto parece que te refieres a un navegador. Bueno, hay Firefox, IE, Opera, etc. ¿Cuál?
humanityANDpeace

Respuestas:

3

Para resolver su problema específico, logré que su código JavaScript se ejecutara sin ningún error en esta versión:

javascript:(function(){function text(){this.type="text"};function password(){this.type="password"};function addHandlers(){var e=false;var t=document.evaluate("//input[@type='password']",document,null,6,null);for(var n=t.snapshotLength-1,r;r=t.snapshotItem(n);n--){if(!e){r.addEventListener("mouseover",text,false);r.addEventListener("mouseout",password,false)}else{r.addEventListener("focus",text,false);r.addEventListener("blur",password,false)}}};addHandlers();alert("bookmarklet loaded");})();

Para ver si su código funciona, agregué un alert("bookmarklet loaded"); al final del bookmarklet. Por lo tanto, puede probar y debería, ya que, como lo probé en Firefox 17, vería que aparece un mensaje. Si su código funciona o no funciona, no puedo decirlo, pero, por supuesto, esta no era la pregunta.

Hay algunas cosas que puede tener en cuenta o hacer una transformación de código JavaScript dentro de <script></script> Etiquetas más fáciles de adoptar para un bookmarklet

  • En el código JavaScript normal, una nueva línea puede separar dos comandos. Bookmarklets están en una línea, así que sustituya el salto de línea con un punto y coma ; .

Un ejemplo aqui

Tengamos un ejemplo. Vamos a tener dos fragmentos de código fuente con dos instrucciones:

var anumber=1
var atext="hallo"

Cuando ponga todo en una línea (= haga el salto de línea a espacios en blanco) primero terminará con esto:

var anumber=1 var atext="hallo"

Esto ya no es un código JavaScript válido. Si desea combinar dos instrucciones en una línea, necesita separar / delimitar las dos instrucciones utilizando un punto y coma como este:

var anumber=1; var atext="hallo"
  • Envuelva todo lo que codifique en este tipo de cierre:
    javascript:(function(){ [...here your code...] })();

Hay bastantes sitios web para investigar la solución. Me gusta aquí .

humanityANDpeace
fuente
En el código javascript normal, una nueva línea puede separar dos comandos. Bookmarklets están en una línea, así que sustituya el salto de línea con un punto y coma; ¿Qué significa ... puedes elaborar más?
vishal
2
Recomiendo insertar puntos y comas siempre, aunque puedes leer más al respecto aquí .
Karan
0

En realidad estabas bastante cerca. Solo necesitas ponerlo de esta manera:

javascript:(function(){mycode})();

En tu ejemplo, puedes probar esto:

javascript:(function(){function text(){this.type="text"};function password(){this.type="password"};function addHandlers(){var e=false;var t=document.evaluate("//input[@type='password']",document,null,6,null);for(var n=t.snapshotLength-1,r;r=t.snapshotItem(n);n--){if(!e){r.addEventListener("mouseover",text,false);r.addEventListener("mouseout",password,false)}else{r.addEventListener("focus",text,false);r.addEventListener("blur",password,false)}}};addHandlers()})();

Por favor, preste atención a los puntos y comas cuando minimice su código, faltaron algunos de ellos.

Kar.ma
fuente
PD Después de publicar mi respuesta, probé su código, ¡y me gusta! Truco útil, he guardado este bookmarklet.
Kar.ma