Foros del Web » Programando para Internet » Javascript »

¿donde puedo encontrar todas las propiedades de los eventos en javascript como stop()

Estas en el tema de ¿donde puedo encontrar todas las propiedades de los eventos en javascript como stop() en el foro de Javascript en Foros del Web. encontré en una marquesina estas propiedades y me gustaron pero estoy buscando todas las propiedades de los eventos, aquí tengo dos propiedades, que es: parar ...
  #1 (permalink)  
Antiguo 22/10/2011, 14:43
Avatar de jor_0203  
Fecha de Ingreso: octubre-2011
Ubicación: mexico
Mensajes: 760
Antigüedad: 12 años, 6 meses
Puntos: 8
¿donde puedo encontrar todas las propiedades de los eventos en javascript como stop()

encontré en una marquesina estas propiedades y me gustaron pero estoy buscando todas las propiedades de los eventos, aquí tengo dos propiedades, que es: parar o seguir, como por ejemplo
onMouseOver="this.stop()"
onMouseOut="this.start()"
pero yo pregunto no hay otras propiedades como ir hacia bajo, o subir, poner del lado derecho o del lado izquierdo
ojala alguien conozca estas propiedades y muchas más que pudieran ayudar
mil gracias
  #2 (permalink)  
Antiguo 22/10/2011, 17:33
Avatar de Raziel_Ravenheart  
Fecha de Ingreso: agosto-2011
Ubicación: Ibagué, Tolima
Mensajes: 192
Antigüedad: 12 años, 8 meses
Puntos: 37
Exclamación Respuesta: ¿donde puedo encontrar todas las propiedades de los eventos en javascript

Podrías mostrarme el enlace de la marquesina?

Ahora si la respuesta:

En javascript, existen eventos y manejadores de eventos, aparte de eso existen los métodos, y los disparadores de eventos. los eventos, son solo el concepto de la acción contenidos en el nombre, como por ejemplo:

click = oprimir alguno de los botones del mouse, casi todos los elementos soportan este evento

dbclick = doble click rápido

mousedown = cuando se oprime el botón del mouse, cualquiera, es solo la parte que se oprime y listo.

mouseup = antecedido del mousedown, sigue este, cuando se suelta el botón del mouse

load = cuando carga una ventana, documento o imágen, solo se puede aplicar a window, body e img, ninguna otra etiqueta genera este evento, y no creo que haya forma de forzarlo, como otros eventos, ya sea el click, keypress, focus, entre otros

focus = cuando se enfoca algún elemento, es decir, se hace click en este y se puede modificar su contenido, el focus es enfocar un objeto. Controles de formulario como botones, cajas de texto, select, input como cajas de chequeo o radio.

blur = cuando se pierde el foco de un objeto, es decir, cuando ya no está escogido un elemento y se pasa al siguiente, esto se hace con tab, o simplemente haciendo click en cualquier lado de la página. Los elementos que soportan el evento focus, soportan este evento.

change = cuando el contenido de algún control como cajas de texto, select, textarea, cambia, se registra este evento, solo algunos elementos como los que te nombre soportan este evento y se ejecuta a veces después de otro evento como el keyup (se suelta una tecla) o blur

keypress = cuando se oprime y suelta una tecla

keydown = cuando se oprime y deja oprimida una tecla

keyup = cuando se suelta una tecla...

Como podrás deducir no todos los eventos se pueden aplicar a todos los elementos, pero hay excepciones como en todo. Por otro lado, hay otros eventos avanzados que luego los verás, por eso, al examinar una lista completa, no podrás hacerlo de la manera correcta, por que no podrás saber exactamente que eventos son aceptados por cuales elementos. La mejor manera de conocer los eventos, funciones y atributos es revisando elemento por elemento de los que existen en html, es decir, aprendiendo DOM.

DOM es una api (application programming interface, interfaz de programación de aplicaciones), que está disponible para todos los lenguajes de script que interactuen con el navegador es decir javascript y VBScript. DOM define el modelo de los objetos en un documento HTML y aparte de eso un grupo de reglas para interactuar con estos. Este grupo de reglas están compuestas por lo que te he venido repitiendo desde hace rato, y no me canso, por que me gusta , así aprendí, estas reglas son propiedades, eventos, los manejadores de eventos que de cierto modo son propiedades y los métodos de cada elemento.

Los manejadores de eventos, son los tipicos on<nombre_evento>, y se acceden como propiedades de un objeto en javascript, por eso digo que de cierto modo son propiedades, y algunos programadores de antaño, se refieren a estos manejadores como propiedades de evento. Entonces, si tomas todos los eventos que te expliqué, y le añades on, tendrás los manejadores de eventos. Sobra decir que hay más:

onclick
ondbclick
onmousedown
onmouseup
onload; De nuevo te recuerdo q este solo se aplica a window, body e img.
onfocus
onblur
onchange
onkeypress
onkeydown
onkeyup

aparte de esto están las propiedades básicas de un elemento, por ejemplo, una propiedad que pueden tener vacia o no todos los elementos es el id. Otras propiedades o atributos serían name, style, class, en el caso de la etiqueta input el atributo type, que es propio de esta.

Hay algunos atributos libres, o autodeclarativos que antes con html, se podían utilizar solos o minimizados, pero si estás utilizando un encabezado de xhtml como

Código HTML:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

estas obligado a utilizarlos de modo que sean válidos según el dtd (document type definition), estas
estos atributos son algunos como disabled, checked, readonly, es decir, antes con html, se podía hacer así:

Código HTML:
Ver original
  1. <input type="text" value="esto está desactivado" disabled><br />
  2. <input type="checkbox" checked><label>Esta caja de chequeo está escogida</label><br />
  3. <textarea cols="20" rows="15" readonly >Esta area de texto solo puede ser leída</textarea>

Ahora con el encabezado que tienes utilizando el dtd de xhtml1-transitional, y en general todo xhtml, estos atributos deben ir igualados a un valor, y este valor debe estar encerrado en comillas dobles, igual que todos los otro atributos de cualquier etiqueta, y por otro lado es recomendable escribir todo en minúscula, así:

Código HTML:
Ver original
  1. <input type="text" value="esto está desactivado" disabled="disabled" /><br />
  2. <input type="checkbox" checked="checked" /><label>Esta caja de chequeo está escogida</label><br />
  3. <textarea cols="20" rows="15" readonly="readonly" >Esta area de texto solo puede ser leída</textarea>

Ahora que ya sabes como eran estos atributos, que existen y como deben ser utilizados ahora, también entenderas que los atributos de estos elementos también pueden ser accedidos desde javascript por medio de DOM, así: (pongámole a cada uno un id pequeño)

Código HTML:
Ver original
  1. <input type="text" id="txt" value="esto está desactivado" disabled="disabled" /><br />
  2.  
  3. <input type="checkbox" id="cb" disabled="disabled" checked="checked" />
  4. <label id="cblab">Esta caja de chequeo está escogida y deshabilitada</label><br />
  5.  
  6. <textarea id="ta" cols="20" rows="15" readonly="readonly" >
  7. Esta area de texto solo puede ser leída

ya teniendo los elementos con id, y suponiendo que están dentro de sus respectiva etiquetas anidadas o sea html y body, podemos acceder a sus atributos desde llabaeskript (ajajajaja que horror... ), así:

Código Javascript:
Ver original
  1. var texto = document.getElementById("txt");
  2. var cajaCh = document.getElementById("cb");
  3. var txtA = document.getElementById("ta");
  4.  
  5. texto.disabled = false;
  6. texto.value = "Ahora se puede escribir aquí";
  7.  
  8. cajaCh.disabled = false;
  9. document.getElementById("cblab").innerHTML = "Ahora esta habilitada"
  10.  
  11. ta.readOnly = false;
  12. ta.value = "Ya se puede escribir aquí";

Te dejo un ejemplo funcional de lo que te estoy diciendo:

Código HTML:
Ver original
  1.     <head>
  2.         <script type="text/javascript">
  3.             window.onload = function () {
  4.                 document.getElementById("btnCambiar").onclick = cambiar;
  5.             }
  6.            
  7.             function cambiar () {
  8.                 var txt = document.getElementById("txt");
  9.                 var txtA = document.getElementById("ta");
  10.                 var texto = "";
  11.                
  12.                 txt.disabled = false;
  13.                 txt.value = "desbloqueado";            
  14.                
  15.                 ta.rows = 5;
  16.                 ta.readOnly = false;
  17.                 ta.value = "Ahora tiene menos espacio, pero se puede escribir.  Digita algo";
  18.                 /*
  19.                 ta.value, también se puede hacer
  20.                 ta.innerHTML, por que textarea necesita etiqueta de cierre, es decir </textarea>
  21.                 */
  22.             }
  23.         </script>
  24.     <head>
  25.    
  26.     <body>
  27.         <input id="txt" type="text" value="bloqueado" disabled="disabled" /><br />
  28.         <textarea id="ta" cols="20" rows="15" readonly="readonly" >Esta area de texto solo puede ser leída
  29.         </textarea><br />
  30.         <button id="btnCambiar">cambiar</button>
  31.     </body>
  32. </html>

continua siguiente respuesta....

Última edición por Raziel_Ravenheart; 22/10/2011 a las 22:12 Razón: Terminar la respuesta
  #3 (permalink)  
Antiguo 22/10/2011, 22:12
Avatar de Raziel_Ravenheart  
Fecha de Ingreso: agosto-2011
Ubicación: Ibagué, Tolima
Mensajes: 192
Antigüedad: 12 años, 8 meses
Puntos: 37
Exclamación Respuesta: ¿donde puedo encontrar todas las propiedades de los eventos en javascript

continuación respuesta...

Como te podrás dar cuenta en este último ejemplo, también se pueden manipular atributos como cols y rows, que por obvias razones, sabemos que pertenecen solo a la etiqueta textarea. Lo mismo que sucede con estos atributos, sucede con los eventos y algunas funciones. Hay otro tipo de atributo que tienen algunos elementos y se llaman colecciones, una colección devuelve un arreglo de todos los elementos que contiene, en el caso de la etiqueta form, esta puede envolver otros elementos llamados controles de formulario, la colección de un form, se llama elements, y en el caso de los select, la colección se llama options. Ahora un ejemplo de elementos html y todas sus características:

Form Object Collections

Colección
elements[] = Devuelve un arreglo de todos los elementos de un formulario

Propiedades del Objeto Form
acceptCharset = Determina o devuelve el valor del atributo accept-charset en un formulario.
action = Determina o devuelve el valor del atributo acción en un formulario
enctype = Determina o devuelve el valor del atributo enctype en un formulario
length = Devuelve el número de elementos en un formulario
method = Determina o devuelve el valor del atributo método en un formulario
name = Determina o devuelve el valor del atributo nombre en un formulario
target = Determina o devuelve el valor del atributo objetivo en un formulario

Métodos del objeto form

reset() = Restaura un formulario
submit() = Envia un formulario

Eventos del objeto formulario
onreset = El botón reset es oprimido
onsubmit = El botón submit es oprimido

Como podrás ver, en esta referencia se observan dos métodos, con sus respectivas contraparte evento, es decir
reset() y onreset
submit() y onsubmit

y ambos son propios solo del elemento form y solo un form puede generar estos eventos, y solo a un elemento form se le puede aplicar estos métodos.
Un ejemplo puede ser que en vez de enviar todos los datos escritos por un cliente, antes los revisas según algunos criterios, y si pasa todos los criterios de revisión, envías los datos del formulario con un elemento_form.submit(), o le avisas al usuario que debe corregir algunas cosas antes de poder enviar el formulario. Por otro lado, hay propiedades, eventos y métodos que se le pueden aplicar a todos o varios elementos.

Finalmente puedo decirte que javascript también cuenta con algunos objetos, y que el navegador como tal también tiene sus objetos, pero todos son accesibles desde javascript por medio de las apis desarrolladas para esto, y la ventaja es que son tan naturales y compatibles, que no pareciera que fueran algo diferente.

Por ahora te dejo un enlace con la referencia de todos los objetos que existían hasta html 4, yo se que ya existe html5 pero por el inicio de todo es mejor, el único problema es que está en ingles, pero ya te darás tus mañas:

Referencia de todos los objetos de Javascript, navegador y DOM de HTML

Y en este enlace está la descripción de todos los atributos, métodos y eventos standard que se le pueden aplicar a casi todos los elementos html:

atributos, métodos y eventos standard

Espero que te sirva, y si no entiendes algo o te parece que algo está raro, solo grita... xD

Exitos
  #4 (permalink)  
Antiguo 22/10/2011, 22:14
Avatar de Raziel_Ravenheart  
Fecha de Ingreso: agosto-2011
Ubicación: Ibagué, Tolima
Mensajes: 192
Antigüedad: 12 años, 8 meses
Puntos: 37
Respuesta: ¿donde puedo encontrar todas las propiedades de los eventos en javascript

Espero poder ofrecerte unos enlaces en español.. buscaré algo parecido a esto, si lo necesitas y te parece más comodo.
  #5 (permalink)  
Antiguo 24/10/2011, 00:51
Avatar de jor_0203  
Fecha de Ingreso: octubre-2011
Ubicación: mexico
Mensajes: 760
Antigüedad: 12 años, 6 meses
Puntos: 8
Respuesta: ¿donde puedo encontrar todas las propiedades de los eventos en javascript

Cita:
Iniciado por Raziel_Ravenheart Ver Mensaje
Espero poder ofrecerte unos enlaces en español.. buscaré algo parecido a esto, si lo necesitas y te parece más comodo.
realmente muchisimas gracias
no pensé que hubiera gente como tu
apenas entre en este portal y ya conocí dos genios
que explicación tan genial
te admiro
y si en algo te puedo ayudar gracias

Etiquetas: encontrar, eventos, propiedades, todas
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 15:06.