2011 18 de febrero 2011

IE Error de JavaScript: El objeto no acepta esta propiedad o método

Tenido este problema extraño, donde un pedazo de Javascript trabajó muy bien en todos los navegadores como IE ans bar de siempre :) Simple ... que era, pero ya que el guión no fue escrito por mí, me tomó un tiempo para depurar este "objeto no admite esta propiedad o método" error de IE que sólo estaba vomitando. Probablemente! Si tuviera que escribir el guión, yo no tengo este error en absoluto, como no se mezclan mis nombres de variables con el campo de identificadores :).

Problema: El objeto no acepta esta propiedad o método (en la línea 3)

function funzoneSP(){ document.getElementById('video_id').style.visibility="hidden"; shortdesc = document.getElementById('shortdesc').value; .... } 

Solución:
El error se genera en el thirdrow en el ejemplo anterior (Línea 3 ... "descripciónBreve = document.getE ...."). He intentado todo tipo de estupideces, de que No me vale ni siquiera la mención aquí y, finalmente, ¿adivinen qué! sólo cambia el var descripciónBreve a otra cosa se ​​deshizo del error. Básicamente! El nombre de la variable tenía que diferente de la fieldID


2009 24 de marzo 2009

SE disabled = "true" y desactivado = "false" lo mismo?

Esta escuela las antiguas, pero como siempre es mi suplemento de memoria ...
Así se desactiva = "true" y los discapacitados = "false" lo mismo? Sí
No creo ..., bueno! esa es la forma en que es ... aquí es una explicación rápida ...
"Discapacitado" es un atributo de cualquier elemento de la forma / de campo y por lo tanto, puede aceptar cualquier valor por su propia naturaleza.

Mientras este atributo está presente, el elemento se desactivará independientemente de su valor. por ejemplo.
<input type="text" value="Esto es disabled" disabled>
<input type="text" value="Esto es disabled" disabled="disabled">
<input type="text" value="Esto es disabled" disabled="true">
<input type="text" value="Esto es disabled" disabled="false">

Todo lo anterior hará que el campo de esta forma "DISABLED".

Simplemente no proporcionar el atributo "DISABLED" mantiene el campo "abled" ... como el de abajo

<input type="text" value="Esto no es disabled" />

Recuerde que "Cualquier valor (o ningún valor) del atributo de personas con discapacidad, representará el explorador deshabilitado". Para mantener las cosas en claro en nuestra mente W3C recomienda que usamos disabled = "disabled" en estas situaciones.

Esta es la diferencia, aunque cuando se utiliza este atributo en javascript ...

document.form.element.disabled = true; / / el elemento se desactivará
document.form.element.disabled = false; / / el elemento se activará

Los argumentos anteriores también son aplicables a estos atributos y elementos:

  • seleccionada (botón de la radio y la casilla de verificación)
  • seleccionados (opción)
  • nowrap (td)

2009 07 de marzo 2009

Llamar a múltiples funciones de Windows onload en Javascript

Aquí está otro pedazo pequeño de engaño Javascript que tenía que cavar a su alrededor porque la situación lo commaned. En uno de mis sitios web, he tenido esta situación en la que tuve que poner en práctica "windows.onload" dos veces. La primera cosa que vino a la mente una experiencia como la mía (tengo que decir honestamente que, desde que he estado utilizando frameworks de JavaScript y las bibliotecas, he olvidado de hacer las cosas simples por mi cuenta ... triste pero cierto), es el siguiente método ...

 window.onload = onloadfn1;
 window.onload = onloadfn2;
 window.onload = onloadfn3;
 etc ..

Lo siento decirlo, pero, este trabajo costumbre ... no quiero hablar sobre la ciencia ejecución de Javascript mucho ... pero de acuerdo a mi experiencia reciente, sólo la última función (onloadfn3) la mala voluntad se ejecuta realmente.

En situaciones normales, a diferencia de la mía (que voy a hablar un poco más tarde) ... puedes hacer lo siguiente para ejecutar funciones mutliple onload ....

O algo como esto

 doOnLoad function () {
         onloadfn1 ();
         onloadfn2 ();
         onloadfn3 ();
 }
 window.onload = doOnLoad;

Por mi situación actual, no puede utilizar cualquiera de los anteriores ...
¿Por qué tengo que llamar a windows.onload dos veces, en lugar que llamar a dos funciones dentro de una función onload sola? Aquí es rápido vistazo a mi declaración del problema ...

"Mis páginas del sitio se estructura como el tema de WordPress .... es decir, hay un header.php y footer.php comunes que se incluyen en todas las páginas del sitio. Hay una función de la Implementación onload en los footer.php para hacer algunas funciones comunes onload. Y hay pocas páginas que necesitan algo de su propia ONLOAD, además de los realizados por la función onload común. Si asigno función de callback directamente al controlador window.onload, será pasar por encima de las devoluciones de llamada asignados previamente en los footer.php "

.... Se entiende mi problema :) ?

Bueno! existen pocas soluciones que se encontró. Todos ellos son muy similares y sobre todo implementions de una solución dada por Simon Willison ( http://simonwillison.net/2004/May/26/addLoadEvent/ ) ...

Solución:

Basta con añadir el código javascript para el sitio ...

 función de addLoadEvent (func) {
     var oldonload = window.onload;
     if (typeof window.onload! = 'function') {
        window.onload = función
     Else {}
        window.onload = function () {
            if (oldonload) {
                   oldonload ()
           }
           func ()
        }
    }
 }

Y lo llaman en lugar del habitual "windows.onload"

 addLoadEvent (FunctionToRunOnPageLoad);
 addLoadEvent (function () {
 / * Más código se ejecute en carga de la página *
 }); 

Las ventajas de este fragmento de código ...
1. En primer lugar, que le permite disponer de múltiples eventos windows.onload, llamada a partir de piezas separadas de su código, sin anulando la definición anterior
2. Es muy discreto. Se puede colocar en un archivo con las secuencias de comandos de otros o en un archivo separado.
3. Funciona incluso si window.onload ya se ha establecido.


2008 25 de diciembre 2008

Carga de archivos JavaScript de forma dinámica

A veces, para mantener el pageweight abajo ... hemos dividido nuestros scripts en fragmentos ... Estos fragmentos de JavaScript se pueden cargar cuando sea necesario (en un evento o hacer clic en un vínculo o un botón, etc.)

Javascripts carga dinámica es sencilla y bastante simple de la siguiente manera ...

= “text/javascript” > <Tipo de script = "text / javascript">
función de loadNewScript (fuente) {
var s = document.createElement ('script');
s.setAttribute ('tipo', 'text / javascript');
s.setAttribute ('src', fuente);
document.body.appendChild (s);
}
</ Script>

y usted puede tener el enlace siguiente en cualquier punto en el cuerpo, o puede hacer que este script "onLoad" del documento en sí ...

= “javascript:loadNewScript('myDynamicScript.js');” >Load Dynamic Script</ a > <A href = "javascript: loadNewScript ('myDynamicScript.js');"> Cargar el script dinámico </ a>

o

<body onload="loadNewScript('myDynamicScript.js');">


2008 03 de octubre 2008

Simple, la mesa de luz ligero, navegador de la Cruz para su página web

No es que no son sólo unos pocos LIGHTBOX de que usted puede encontrar cuando buscas en google. El problema con la mayor parte de la caja de luz que encontré fue que todos parecían utilizar uno o los otros marcos pesados ​​JAVASCRIPT peso, como jQuery, Prototype, Mootools y los gustos. Todos ellos son fresco y elegante busca. Pero si su requerimiento es "pero quiero un SCRIPT LIGHTBOX simple y ligera para mi sitio", entonces aquí es;

Algunas características interesantes de esta caja de luz

  1. Muy claro
    una. 4kb de secuencias de comandos cuando se envasa (8 kb sin embalaje)
    b. 2 kb de CSS
    c. Pocas líneas de HTML para el contenedor de la colección
  2. Fácil de entender y poner en práctica
  3. Puede tener varias cajas de luz en la misma página.
  4. El contenedor de la colección se utiliza la misma para mostrar, a los diferentes contenidos (que se incluyen por separado en divisiones ocultas en la página), en función de la relación / opción que se hace clic.
  5. Se centra automáticamente, tomando en consideración todos los factores tales como, la altura y la anchura de ventana (resolución de la pantalla), la cantidad de desplazamiento de páginas y la altura de los contenidos de la caja de luz
  6. Probado en IE 7 y FF

Ver demostración |
Descargue la mesa de luz Postal Fuente (Descargado 1800 veces)


Uso de la colección [Archivos en el archivo zip]

jo.js y jo_pack.js [versión]: - lleno de un simple conjunto de objetos JavaScript [JO], que contiene los elementos, ventanas y guiones de documentos de posicionamiento. Puede abrir JO.JS si desea ensuciarse las manos con un poco de Javascripting avanzada, la creación de funciones abstractas, que se extiende propiedades de los elementos y tal. Si no demasiado Javascripting, no lo toque.

lightbox.js, lightbox_pack.js [versión llena de]: - Contiene secuencias de comandos de administrador de la caja de luz. Si usted es diseñador de la página, también es responsable de implementar la mesa de luz en la página, usted necesita entender la LightBoxManager. LightBoxManager contiene básicamente showLightBox sólo dos funciones y closeLightBox.

lightbox.css: - Si conoces CSS, se puede jugar con lightbox.css para personalizar el aspecto-n-feel lightbox.css

index.html: aplicación de muestra de la caja de luz con dos contenidos diferentes

lb_underlay_bkg.png: - Esta es la luz / Simi imagen transparente que se utiliza el fondo para la capa base la colección [calco subyacente es la capa debajo de la lighbox, que evita que el usuario haga clic en cualquier otra entidad en la página, mientras que la colección está abierta]. Se puede utilizar cualquier imagen o incluso un color sólido para este propósito, dependiendo del diseño de la página y la exigencia.

icon_lb_close.gif: - La imagen de la colección de mango cerca de la parte superior derecha de la caja de luz. Puede utilizar cualquier imagen como por el diseño

Ver demostración |
Descargue la mesa de luz Postal Fuente (Descargado 1800 veces)

Por favor, háganos llegar sus comentarios y sugerencias ...


2008 13 de septiembre 2008

JavaScript: Editar página web en el navegador

Bueno, debo decir que no, como una pieza útil de la ciencia, pero si eres un desarrollador web, puede venir a mano, algún día (o lo hará?). Aquí es bookmarklet pequeño, que permite editar la página web para cualquier sitio.
Y ¡Lo siento! Puede guardar los resultados en su máquina local.

javascript: document.body.contentEditable = 'true'; document.designMode = "on"; void 0


2008 02 de septiembre 2008

CSS hack: Javascript, CSS, HTML para Firefox sólo

Muchas veces nos sentimos la necesidad de escribir específicos sobre hacks de navegador (aunque no es una buena práctica, que los desarrolladores de la interfaz de usuario tienen que recurrir a tales males, hasta las guerras de navegadores grandes llega a una tregua). Anteriormente, había mencionado en este artículo para el IE sólo , cómo escribir un fragmento de código CSS que sería visible para los navegadores Internet Explorer <IE7 sólo.

Ayer tuve un caso, donde yo quería escribir algo de Complemento específico de fragmentos de CSS. Bueno! No estoy seguro si hay un código CSS para esto, pero hay un HTML. Hay una trampa Aunque, este trozo de código HTML de validación de HTML doesnot pase. Pero, anywaz! Si le pegan mal o como tal, no tienen ninguna relación-para la validación (en algún momento tenemos que ser cruel), usted podría utilizar el siguiente para declarar un enlace a una hoja de estilo FF único, ni siquiera sólo el código de la CSS dentro de este bloque. El código es

<comentario> Pon tu Firefox sólo HTML / CSS / Secuencias de comandos aquí </ comentario>

por ejemplo,
<comentario>
<style>
O * Los estilos de FF sólo * /
fieldset {border: 1px solid # dddddd;}
</ Style>
</ Comentario>

Yo "estoy contento por el momento ...


2008 01 de septiembre 2008

Quitar elemento específico de una matriz de JavaScript que coincide con una cadena que se pasa

Aquí hay manera rápida de ampliar el objeto nativo de JavaScript Array, sólo para hacer que ...

Array.prototype. removeItem =function(str) {
for(i=0; i<this.length ; i++){
if(escape(this[i]).match(escape(str.trim()))){
this.splice(i, 1); break;
}
}
return this;
}

Así que ahora usted puede hacer algo como esto ...

var animals= new Array("dog","lion","cat","tiger","elephant");
animals. removeItem ('tiger');

Ahora la matriz contendrá los animales "perro", "león", "gato", "elefante";

PD: Y aquí está el prototipo de cadena recorte demasiado ...

String.prototype.trim=function(str) {
str = this != window? this : str;
return str.replace(/^\s+/g, '').replace(/\s+$/g, '');
}


Disfrute de ....


2008 15 de mayo 2008

Mejores prácticas: Trabajar con JavaScript

Incluir JavaScript en la parte inferior del documento HTML

Si usted no tiene document.write (o de cualquier generación dinámica de contenidos de la página Uso de archivos JavaScript) para insertar parte del contenido de la página en los scripts, mueva el script de incluir una declaración en la parte inferior de la página, antes del final de la etiqueta BODY.
La especificación HTTP/1.1 sugiere que los navegadores de descarga no más de dos componentes en paralelo por el nombre de host. Si va a servir a sus imágenes de varios nombres de host, puede obtener más de dos descargas que se producen en paralelo. Mientras que un script se está descargando, sin embargo, el navegador no se iniciará ningún tipo de descarga de otro modo, incluso en los diferentes nombres de host.
También hay formas de crear dinámicamente los nodos SCRIPT y cargar scripts remotos después de la página se carga mediante AJAX.

Externalizar a JavaScript

Uso de archivos JavaScript externos se traducirá en una carga más rápida de páginas debido a que los archivos JavaScript se almacenan en caché por el navegador. "En línea de JavaScript en los documentos HTML se descargan cada vez que se solicita el documento HTML. En realidad, esto podría reducir el número de peticiones HTTP realizadas pero posteriormente aumenta el tamaño del documento HTML. Externa de JavaScript se almacenan en caché por el navegador, el tamaño del documento HTML se reduce sin aumentar el número de peticiones HTTP.
Tenga en cuenta que, si los usuarios de su sitio con vistas de varias páginas por sesión y muchas de sus páginas de volver a utilizar los mismos scripts y hojas de estilo, hay un mayor beneficio potencial de la caché de archivos externos.

Empaquetar los archivos Javascript

En el caso de JavaScript, a diferencia de CSS, los archivos pueden crujir el uso de algunos algoritmos estándar que dan un tamaño de archivo reducido a la simple eliminación de espacios o tabuladores. Un ejemplo de Javascript empacador se puede encontrar aquí http://dean.edwards.name/packer/

Deshágase de los scripts duplicados

Es muy inusual que los guiones enteros podría ser duplicada, pero una revisión de los diez mejores sitios web de Estados Unidos muestra que dos de ellos contienen un guión duplicado. Duplicar las secuencias de comandos pero, obviamente, reduce el rendimiento mediante la creación de las peticiones HTTP innecesarias y pérdida de la ejecución de JavaScript.
Además, en muchos casos, aunque los nombres de las secuencias de comandos son diferentes, hay una probabilidad de scripts duplicados en la misma página por el tamaño del equipo y el número de secuencias de comandos.

Reducir al mínimo el acceso a los elementos DOM cuando sea posible

Acceso a los elementos DOM con JavaScript es lento por lo que con el fin de tener una página de mayor capacidad de respuesta, usted debe:
• Las referencias a los elementos de caché de acceso
• Los nodos de actualización "en línea" y luego añadir al árbol
• evitar la fijación de diseño con JavaScript

Comportamiento separado del contenido y presentación

Así como la presentación por separado (CSS / XSLT) de contenidos (XHTML / XML), también hay que separar el comportamiento (Javascript). Esto se llama Javascript discreta. Así como enlaces a archivos CSS externos, que debería enlazar a archivos externos de JavaScript.

En lugar de un comportamiento difícil de codificación en el contenido (por ejemplo, onmouseover, onclick, etc), el comportamiento debe agregarse de manera dinámica a los elementos, clases y elementos singulares (IDS) utilizando el DOM. El documento fundacional, el contenido, debe contener sólo es válido XHTML / XML y Javascript no.
Javascript debe aumentar el contenido mediante la adición de comportamiento. El contenido debe seguir siendo útil y utilizable sin javascript (o sin el pleno apoyo de Javascript).


2008 15 de marzo 2008

Irrita los cuadros de selección visibles a través de las divisiones de ventanas emergentes

En varias ocasiones, mientras que hace los diseños de página con las divisiones de popup / Cajas de Luz y consejos, etc nos encontramos con situaciones en las que algunos objetos de formulario SELECT pasa a ser en estas divisiones POPUP, por diseño y se muestra a través de .... ¡Puaj!

Bueno! fácilmente se podría solucionar este problema ajustando sus valores de índice z adecuadamente para FF y IE7. Sin embargo, Good Old (nunca mejor dicho) IE6 no se comporta según lo previsto .... El programa Select Box a través, incluso después de aplicar algunas drásticamente altos valores de índice z de su División ... PopUp Charlatán!!

No hay soluciones para este problema, pero están ahí, creo yo, más que una manera de trabajar unos pocos-en torno a este problema, pero estoy aquí para decirles que la solución más sencilla que yo uso, que funciona bien para mí, en la mayor parte de la los casos ....

"Ocultar la caja de ROUGE SELECT cuando se muestra la POPUP"

Simplemente, en el fragmento de secuencia de comandos donde usted muestra su emergente, agregar un trozo de secuencia de comandos para establecer la visibilidad de la caja de selección de "Oculto"

document.getElementById ('my_select') style.visibilty = "hidden".;

Y recuerde que retroceder en el cierre de la División de PopUp

. document.getElementById ('my_select') style.visibilty = "visible";

donde "my_select" es el ID de la caja de la irritación SELECT

Espero que esto ayude ...

PS. Hay por supuesto, son otras opciones como dinámicamente positionining un IFRAME (mismo tamaño que usted PopUp) en el marco del DIV emergente ... Esto funciona muy bien también, pero con una adición de un montón de elementos DOM, scripts y dolor de cabeza. He utilizado esta solución también, y si usted necesita cualquier ayuda con esta opción, me deja saber. Estará encantado de ayudarle!


NDK en casa | Expresando IT | Boca Expresando | Penmenship Expresando | Awe Expresando | expresarme