Autor Tema: Al hacer doble clic en opción de un Select Múltiple abrir ventana con JavaScript  (Leído 8932 veces)

Príncipe_Azul

  • Principiante
  • **
  • Mensajes: 71
    • Ver Perfil
    • Foro ArgentinaIRC - Ayuda de Programación General, IRC y mIRC Scripting!
Hola amigos!!! :) Espero que anden muy bien!! :D

Bueno les comento, estoy tratando de hacer un select múltiple para que al hacer doble clic en alguna opción, se abra una ventana con las páginas webs, ejemplo:

Nombre: Argentina
Valor: www.a......

Nombre: España
Valor: www.......

y así sucesivamente, o sea al visualizar el select se puede ver los nombres de los países y al hacer doble clic en algún país se debe abrir una nueva ventana con la página correspondiente de cada país (value="http://www.paginaweb.com/").

Dejo el código que tengo hasta el momento:

Código: [Seleccionar]
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="es-ar">
<head>
  <title></title>
</head>
<body>
<select size="10" name="MySelect" multiple="multiple"
 ondblclick="window.open(this.value)">
<option value="http://www.paginaweb.com/">Argentina
</option>
</select>
</body>
</html>


he probado de varias formas pero no me funciona, si bien se abre una nueva ventana, pero yo quisiera que sea una ventana normal, no una popup. También he probado como está el código ahora, y no me abre una ventana popuo, sino una normal, pero como nueva pestaña en vez de nueva ventana.

¿De qué manera puedo lograr esto?

Muchas gracias como siempre!!! :)
« Última modificación: 17 de Junio 2015, 13:50 por Ogramar »

Ogramar

  • Moderador Global
  • Experto
  • *******
  • Mensajes: 2662
    • Ver Perfil
Hola Principe Azul en el curso http://aprenderaprogramar.com/index.php?option=com_content&view=category&id=78&Itemid=206 se trata la gestión de ventanas con JavaScript y en concreto en la entrega CU01174E vienen explicados los métodos para abrir ventanas y ejemplos.

Una cosa que tienes que comprobar es si un item de un select múltiple admite el evento doble click. Para ello simplemente puedes hacer que se muestre un alert. Si se muestra el alert es que admite el evento y en ese caso no tienes problema en que la respuesta al evento sea la apertura de una venta.

También tienes que tener en cuenta que en algunos casos los navegadores pueden bloquear la apertura de ventanas.

Salu2

Príncipe_Azul

  • Principiante
  • **
  • Mensajes: 71
    • Ver Perfil
    • Foro ArgentinaIRC - Ayuda de Programación General, IRC y mIRC Scripting!
Hola amigo Ogramar, gracias por tu ayuda, he tratado de varias formas e incluso también me están ayudando en otro foro y aún así no logra funcionar completamente, es decir, las ventanas se abren sin problemas, pero o bien pasa una cosa o bien pasa otra, aquí te muestro mi ante último mensaje:

Citar
GonzaH:

He probado tus 2 códigos, el primero código me abre la página en la misma ventana, así lo dejé al código:

Código: [Seleccionar]
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="es-ar">
<head>
  <title>select</title>
  <script>
function nav(value) {
if (value != "") { location.href = value; }
}
  </script>
</head>
<body>
<select style="font-size: 15px; width: 130px; height: 90px;"
 multiple="multiple" ondblclick="nav(this.value);">
<option value="http://www.paginaweb.net/">Mis
Artesan&iacute;as
</option>
<option value="http://paginaweb.com/">Canal
#Huelva
</option>
<option value="http://paginaweb/" target="_blank">Ver
Tutoriales
</option>
<option value="http://paginaweb.com/">Mega Forero
</option>
</select>
</body>
</html>


Probé el segundo código, si bien se abre la página como nueva ventana, pero se abre restaurada y sin el menú de opciones.

He modificado el código para intentar dejarlo como deseo, casi esta listo, ya que se abre la página como nueva ventana y maximizada, pero le faltan las opciones del menú, tendría que abrirse así:



pero se abre así:




Este es el código modificado:

Código: [Seleccionar]
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="es-ar">
<head>
  <title>select</title>
  <script>
function nav(value) {
if (value != "") { open(value, "_blank", "toolbar=yes, scrollbars=yes"); }
}
  </script>
</head>
<body>
<select style="font-size: 15px; width: 130px; height: 90px;"
 multiple="multiple" ondblclick="nav(this.value);">
<option value="http://www.paginaweb.net/" target="_blank">Mis
Artesan&iacute;as </option>
<option value="http://paginaweb.com/">Canal
#Huelva
</option>
<option value="http://paginaweb.com/" target="_blank">Ver
Tutoriales
</option>
<option value="http://paginaweb.com/">Mega Forero
</option>
</select>
</body>
</html>


Saludos y muchas gracias!! :)

PD: Acabo de probar poniedo menubar=yes, y funciona en firefox, pero de igual manera no se visualizan los enlaces de acceso directo, es decir Los favoritos no se ven, y en Internet Explorer en vez de salirme así:



sale así:



además no se puede maximizar.

Si esto no es posible hacerlo, no importa amigos, lo haré con una lista desplegable, me imagino que eso si funcionará, lo que quiero es para las webs amigas, ya que en mi theme se pueden poner solo 4 :)

Fuente: http://www.smfpersonal.net/off-topic/al-hacer-doble-clic-sobre-una-opcion-de-un-select-multiple-no-me-abre-la-ventana-t8614.0.html;msg58564#new


No se si es posible amigo Ogramar, si no es posible, entónces voy a buscar una alternativa como por ejemplo usar una lista desplegable, u otra cosa.
En el theme/tema que uso en mi foro, solo se pueden poner 4 webs amigas y yo quiero poner más, pero si agrego más, el footer se alargará y no quedará bien.

Saludos y muchas gracias hermano!! :)
« Última modificación: 18 de Junio 2015, 06:54 por Príncipe_Azul »

Príncipe_Azul

  • Principiante
  • **
  • Mensajes: 71
    • Ver Perfil
    • Foro ArgentinaIRC - Ayuda de Programación General, IRC y mIRC Scripting!
Hola nuevamente!!

Bueno probando y probando, he comprobado que Firefox no responde como debería ser, es decir que por más que el atributo target="_blank" esté especificado en un href, lo mismo Firefox abrirá las webs en nuevas pestañas, en vez de nuevas ventanas.

Lo he solucionado utilizando este código:

Código: [Seleccionar]
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="es-ar">
<head>
  <title>select</title>
</head>
<body>
<ul style="width: 130px; height: 60px; overflow: auto;">
  <li><a href="http://www.pagina1.net/" target="_blank">Pagina
web 1</a></li>
  <li><a href="http://Pagina2.com/" target="_blank">Pagina
web 2</a></li>
  <li><a href="http://pagina3.com/" target="_blank">Pagina
web 3</a></li>
  <li><a href="http://pagina4.com/" target="_blank">Pagina
web 4</a></li>
</ul>
</body>
</html>

Así me gusta más como queda!!

Captura de como quedó:



Aún así lo mismo Firefox me seguía abriendo las ventanas como Nuevas pestañas. cuando en realidad debería abrirlas como Nuevas ventanas, es raro este comportamiento en Firefox, ya que si se usa el atributo target="_blank", debería abrirlas justamente como Nuevas ventanas, pero no pasa eso...

Así que buscando en las opciones del navegador, he podido encontrar como solventar este inconveniente, dejo una captura que lo explica todo:



Solo hay que destilar la casila que está recuadrada con color verde y presionar el botón Aceptar, y Firefox abrirá las páginas como Nuevas ventanas.

Saludos y muchas gracias!! :)

« Última modificación: 19 de Junio 2015, 10:45 por Ogramar »

Ogramar

  • Moderador Global
  • Experto
  • *******
  • Mensajes: 2662
    • Ver Perfil
Hola gracias por comentar la solución, has comentado un problema que trae de cabeza a todos quienes trabajan con desarrollow web y es que los distintos navegadores tienen distintos comportamientos  :(. Eso es un gran problema porque puedes crear un código que sea bueno pero en algunos navegadores no funciones, o que funcione de distinta manera a como era de esperar. Para esto hay muchos distintos tipos de soluciones pero sigue siendo un problema... y lo peor es que no parece que vaya a dejar de serlo (a pesar de que se ha avanzado mucho y ya no existen las diferencias que existían en los primeros años de desarrollo de internet)

Salu2

Príncipe_Azul

  • Principiante
  • **
  • Mensajes: 71
    • Ver Perfil
    • Foro ArgentinaIRC - Ayuda de Programación General, IRC y mIRC Scripting!
Tienes toda la razón, pero esto que me pasó me resulta bastante extraño por el comportamiento de Firefox, teniendo en cuenta de que Firefox es uno de los mejores navegadores del mundo y aún así al especificar un atributo target="_blank" en un href, debería abrir la página como Nueva ventana, pero esto Firefox no lo hace, ya que lo que hace es abrir la web como Nueva pestaña, y es realmente raro que un navegador como Firefox no tenga en cuenta de que si justamente se está utilizando target="_blank", como puede ser que aún así abra las webs en nuevas pestañas... es más, por defecto viene así!!!! y a pesar de que mi conocimiento en programación web es nulo, pero me parece que esto no debería ocurrir, es más tengo una versión actualizada de Firefox, no es la última, pero es una versión nueva (37.0).

Y es verdad, muchas cosas funcionan distintas en diferentes navegadores, si mirás la fuente de donde me ayudaron, verás que hemos luchado para lograrlo y aún así no lo hemos podido hacer, ya que parece que la única solución es cambiar las opciones por defecto de Firefox, por eso dejé la solución, para que alguien más pueda saber como lograr de que Firefox abra las webs como nuevas ventanas (usando el botón primario).

Muchos programadores de páginas webs, utilizan condicionales para tratar de mejorar el diseño de las webs y otras cosas, si entran a una web con IE se muestra de una forma y si entran con Firefox, se muestra de otra y así con los demás navegadores, pero aún así no siempre es suficiente.

Saludos hermano y gracias por tu ayuda y opinión!!!

Un abrazo! :)
« Última modificación: 19 de Junio 2015, 11:33 por Príncipe_Azul »

 

Sobre la educación, sólo puedo decir que es el tema más importante en el que nosotros, como pueblo, debemos involucrarnos.

Abraham Lincoln (1808-1865) Presidente estadounidense.

aprenderaprogramar.com: Desde 2006 comprometidos con la didáctica y divulgación de la programación

Preguntas y respuestas

¿Cómo establecer o cambiar la imagen asociada (avatar) de usuario?
  1. Inicia sesión con tu nombre de usuario y contraseña.
  2. Pulsa en perfil --> perfil del foro
  3. Elige la imagen personalizada que quieras usar. Puedes escogerla de una galería de imágenes o subirla desde tu ordenador.
  4. En la parte final de la página pulsa el botón "cambiar perfil".