FAQs JavaScript

chivi · #16 (**permalink**) 01/12/2002, 19:49

P: ¿Cómo puedo hacer que agreguen mi sitio web, como su página de Inicio?

R:

Código PHP:

  <html>

<head>

<script language="JavaScript">

<!--

function Pagina_Inicio() 

{ 

obj_Pagina_Inicio.style.behavior='url(#default#homepage)';

obj_Pagina_Inicio.setHomePage("[COLOR=orangered][U]http://www.tu_sitio.com[/U][/COLOR][U][/U]");

} 

//-->

</script>

</head>

<body>

<IE:HOMEPAGE ID="obj_Pagina_Inicio"/>

<a href="javascript:Pagina_Inicio();">Convierte [COLOR=orangered][U]Tu Sitio Web[/U][/COLOR] en tu página de Inicio</a>

Únicamente debes cambiar los contenidos con Color Rojo Anaranjado o Subrayado

chivi · #17 (**permalink**) 01/12/2002, 20:01

P: ¿Cómo puedo hacer que agreguen mi sitio web a sus Favoritos?

R:

Código PHP:

  <html>

<head>

<script language="JavaScript1.2">

var url="http://www.tu_sitio.com" 

var titulo="Tu Sitio Web"

function agregar(){

if (document.all)

window.external.AddFavorite(url,titulo)

}

</script>

</head>

<body>

<script>

if (document.all)

document.write('<a href="javascript:agregar()">Agregar a Favoritos</a>')

</script>

</body>

</html>

A pesar de ese pequeño código, se puede simplificar poniéndolo únicamente en el Tag del Body: <a href="javascript:window.external.AddFavorite('http ://www.tu_sitio.com', 'Tu Sitio Web')">Agregar a Favoritos</a> .
¿Cuál es la diferencia? Pues el que os puse al principio, es para evitarnos cualquier posible error con Navegadores distintos al Internet Explorer. Es el que os recomiendo poner.

chivi · #18 (**permalink**) 01/12/2002, 21:08

P: ¿Cómo puedo poner un mensaje en la Barra de Estado al pasar sobre un enlace?

R:

Código PHP:

  <a href="indice.htm" onmouseover="status='Ir al Índice'; return true" onmouseout="status=''">Home</a>

Éste es uno de los más facilitos

chivi · #19 (**permalink**) 01/12/2002, 21:20

P: ¿Se puede crear una alerta con opciones de Ok y Cancelar?

R:

Código PHP:

  <html>

<head>

<script language="Javascript">

function preguntar(){

confirmar=confirm("¿Eres mayor de edad?");

if (confirmar)

//Aquí pones lo que quieras si da a Aceptar

alert('Diste a Aceptar')

else

//Aquí pones lo que quieras Cancelar

alert('Diste a Cancelar')

}

</script>

</head> 

<body>

<a href="java script:preguntar()">Cuidao que muerdo</a>

</body>

</html>

Kaopectate · #20 (**permalink**) 01/12/2002, 21:44

P: ¿Como puedo validar un rango de fechas para que ambos valores sean no vacíos, válidos, y la fecha hasta sea mayor o igual que la fecha desde?

R: [ver ejemplo]

Código PHP:

  <html>

 <head>

  <script language="JavaScript">

 
   function esDigito(sChr){

    var sCod = sChr.charCodeAt(0);

    return ((sCod > 47) && (sCod < 58));

   }

 
   function valSep(oTxt){

    var bOk = false;

    bOk = bOk || ((oTxt.value.charAt(2) == "-") && (oTxt.value.charAt(5) == "-"));

    bOk = bOk || ((oTxt.value.charAt(2) == "/") && (oTxt.value.charAt(5) == "/"));

    return bOk;

   }

 
   function finMes(oTxt){

    var nMes = parseInt(oTxt.value.substr(3, 2), 10);

    var nAno = parseInt(oTxt.value.substr(6), 10);

    var nRes = 0;

    switch (nMes){

     case 1: nRes = 31; break;

     case 2: nRes = 28; break;

     case 3: nRes = 31; break;

     case 4: nRes = 30; break;

     case 5: nRes = 31; break;

     case 6: nRes = 30; break;

     case 7: nRes = 31; break;

     case 8: nRes = 31; break;

     case 9: nRes = 30; break;

     case 10: nRes = 31; break;

     case 11: nRes = 30; break;

     case 12: nRes = 31; break;

    }

    return nRes + (((nMes == 2) && (nAno % 4) == 0)? 1: 0);

   }

 
   function valDia(oTxt){

    var bOk = false;

    var nDia = parseInt(oTxt.value.substr(0, 2), 10);

    bOk = bOk || ((nDia >= 1) && (nDia <= finMes(oTxt)));

    return bOk;

   }

 
   function valMes(oTxt){

    var bOk = false;

    var nMes = parseInt(oTxt.value.substr(3, 2), 10);

    bOk = bOk || ((nMes >= 1) && (nMes <= 12));

    return bOk;

   }

 
   function valAno(oTxt){

    var bOk = true;

    var nAno = oTxt.value.substr(6);

    bOk = bOk && ((nAno.length == 2) || (nAno.length == 4));

    if (bOk){

     for (var i = 0; i < nAno.length; i++){

      bOk = bOk && esDigito(nAno.charAt(i));

     }

    }

    return bOk;

   }

 
   function valFecha(oTxt){

    var bOk = true;

    if (oTxt.value != ""){

     bOk = bOk && (valAno(oTxt));

     bOk = bOk && (valMes(oTxt));

     bOk = bOk && (valDia(oTxt));

     bOk = bOk && (valSep(oTxt));

     return bOk;

    }

   }

 
   function fechaMayorOIgualQue(fec0, fec1){

    var bRes = false;

    var sDia0 = fec0.value.substr(0, 2);

    var sMes0 = fec0.value.substr(3, 2);

    var sAno0 = fec0.value.substr(6, 4);

    var sDia1 = fec1.value.substr(0, 2);

    var sMes1 = fec1.value.substr(3, 2);

    var sAno1 = fec1.value.substr(6, 4);

    if (sAno0 > sAno1) bRes = true;

    else {

     if (sAno0 == sAno1){

      if (sMes0 > sMes1) bRes = true;

      else {

       if (sMes0 == sMes1)

        if (sDia0 >= sDia1) bRes = true;

      }

     }

    }

    return bRes;

   }

 
   function valFechas(){

    var bOk = false;

    if (valFecha(document.f1.fec0)){

     if (valFecha(document.f1.fec1)){

      if (fechaMayorOIgualQue(document.f1.fec1, document.f1.fec0)){

       bOk = true;

       alert("Ok");

      } else {

       alert("Rango inválido");

       document.f1.fec1.focus();

      }

     } else {

      alert("Fecha inválida");

      document.f1.fec1.focus();

     }

    } else {

     alert("Fecha inválida");

     document.f1.fec0.focus();

    }

   }

 
  </script>

 </head>

 <body>

  <form name="f1">

   <table>

    <tr>

     <td align="right">

      Fecha inicial (dd/mm/aaaa): 

     </td>

     <td>

      <input type="text" size="10" name="fec0">

     </td>

    </tr>

    <tr>

     <td align="right">

      Fecha final (dd/mm/aaaa): 

     </td>

     <td>

      <input type="text" size="10" name="fec1">

     </td>

    </tr>

    <tr>

     <td colspan="2" align="center">

      <input type="button" name="val" value="Validar" onclick="valFechas()">

     </td>

    </tr>

   </table>

  </form>

 </body>

</html>

Kaopectate · #21 (**permalink**) 01/12/2002, 21:45

P: ¿Como puedo comprobar si un checkbox está seleccionado?

R: [ver ejemplo]

Código PHP:

  <html>

 <head>

  <script language="JavaScript">

   function estado(){

    if (document.frm.chk.checked)

     alert("Marcado");

    else

     alert("Desmarcado");

   }

  </script>

 </head>

 <body>

  <form name="frm" onClick="estado()">

   <input type="checkbox" name="chk">Selector<br>

  </form>

 </body>

</html>

Kaopectate · #22 (**permalink**) 01/12/2002, 21:46

P: ¿Como puedo redireccionar mi página a otras dependiendo de la resolución del browser del cliente?

R:

Código PHP:

  <html>

 <head>

  <script language="JavaScript">

   function redireccionar() {

    var url640x480 = "http://www.tu-sitio.com/640x480";

    var url800x600 = "http://www.tu-sitio.com/800x600";

    var url1024x768 = "http://www.tu-sitio.com/1024x768";

    var nWdt = screen.width;

    var nHgh = screen.height;

    if ((nWdt == 640) && (nHgh == 480)) window.location.href= url640x480;

    else if ((((nWdt == 800) && (nHgh == 600)) window.location.href= url800x600;

    else if ((nWdt == 1024) && (nHgh == 768)) window.location.href= url1024x768;

    else window.location.href= url640x480;

   }

  </script>

 </head>

 <body onLoad="redireccionar()">

 </body>

</html>

Kaopectate · #23 (**permalink**) 02/12/2002, 08:49

P: ¿Como puedo hacer una página "fullscreen"?

R: [ver ejemplo]

Nota: donde dice "java script" debería decir "JavaScript"

Código PHP:

  <html>

 <head>

  <script language="JavaScript">

 
   function fullFullScr(){

    var vent = null;

    vent = window.open('','vVent','fullscreen=yes')

    llenaVentana(vent);

    // Para direccionar a una página específica, elimine la linea anterior

    // y utilice la siguiente:

    // vent.location = "miPagina.htm";

   }

 
   function llenaVentana(vent){

    with (vent.document){

     open();

     write("<html><head></head><body>")

     write("(Solo funciona sobre IE v.4 o superior)<br>")

     write("Recuerde colocar un botón para carrar<br><br>")

     write("<input type='button' value='Cerrar' onclick='JavaScript:window.close()'>")

     write("</html>")

     close();

    }

   }

 
  </script>

 </head>

 <body>

  <input type="button" value="Abrir FullScreen" onclick="fullFullScr()">

 </body>

</html>

Kaopectate · #24 (**permalink**) 02/12/2002, 09:17

P: ¿Como puedo meter mi codigo en un .js?

R:

Veamos como colocar una función dentro de un .js a través de un ejemplo:

Supongamos que tenemos la siguiente página y que deseamos aislar la función

cerrar() dentro de un archivo llamado librerias.js.

Página original

Código PHP:

  <html>

 <head>

  <script language="JavaScript">

   function cerrar(){

    window.close();

   }

  </script>

 </head>

 <body>

  <input type="button" value="Abrir FullScreen" onclick="cerrar()">

 </body>

</html>

Lo primero que debemos hacer es "aislar" el código JavaScript contenido

entre las etiquetas <script> y </script> de la siguiente manera:

librerias.js

Código PHP:

  // Nótese que no se debe colocar ningún tag HTML. Ni siquiera <script>.

function cerrar(){

 window.close();

}

La página transformada quedaría de la siguiente manera:

Página transformada

Código PHP:

  <html>

 <head>

  <script language="JavaScript" src="librerias.js">

  </script>

 </head>

 <body>

  <input type="button" value="Abrir FullScreen" onclick="cerrar()">

 </body>

</html>

Colocar el código de esta manera tiene las siguientes ventajas:
- Da mayor claridad a la página.
- Ayuda a reutilizar el código.
- Dificulta (no imposibilita) la lectura del código por terceros.

Notas:
- Se pueden incluir tantos archivos .js como se necesiten.
- La inclusión puede estar tanto en el <head> como en el <body>.

Mickel · #25 (**permalink**) 02/12/2002, 09:27

P: Como comprobar si todos los radios buttons de un formulario han sido respondidos

R:

Código PHP:

  var el = document.(tu formulario).elements;

for (var i = 0 ; i < el.length ; ++i) {

    if (el[i].type == "radio") {

        var radiogroup = el[el[i].name];

        var itemchecked = false;

        for (var j = 0 ; j < radiogroup.length ; ++j) {

            if (radiogroup[j].checked) {

            itemchecked = true;

            break;

            }

        }

        if (!itemchecked) { 

            i=0;

            break;

        }

    }

}

if (i>0) {

    return true;

} else {

    alert("No ha respondido todas las preguntas");

    return false;

}

Kaopectate · #26 (**permalink**) 02/12/2002, 09:48

P: ¿Como puedo habilitar o deshabilitar un campo de texto según la opción seleccionada en un radiobutton?

R: [ver ejemplo]

Código PHP:

  <html>

 <head>

  <script language="JavaScript">

 
   function habilita(){

    document.frm.txt.disabled = false;

   }

 
   function deshabilita(){

    document.frm.txt.disabled = true;

    document.frm.txt.value = "";

   }

 
  </script>

 </head>

 <body>

  <form name='frm'>

   <b>Sexo:</b><br>

   <input type="radio" name="rad" value="M" onclick="deshabilita()">

   Masculino<br>

   <input type="radio" name="rad" value="F" onclick="deshabilita()">

   Femenino<br>

   <input type="radio" name="rad" value="O" onclick="habilita()">

   Otro   (Indique cual:

   <input type='text' name='txt' disabled>)

  </form>

 </body>

</html>

Kaopectate · #27 (**permalink**) 02/12/2002, 10:06

P: ¿Como puedo ocultar o hacer aparecer un campo de texto según la opción seleccionada en un combobox?

R: [ver ejemplo]

Existen varias maneras de hacerlo. Esta es una de ellas:

NOTA: Hace uso de una página en blanco llamada DummyPg.htm la cual solo necesita contener los tags de <html>, <head> y <body>.

Código PHP:

  <html>

 <head>

  <script language="JavaScript">

 
   var muestraTexto = false;

 
   function cambiaSelector(){

    with (window.pantalla.document){

     muestraTexto = (frm.selector.selectedIndex == 1? true: false);

    }

    formulario();

   }

 
   function formulario(){

    with (window.pantalla.document){

     open();

     writeln("<html>\n<body>");

     writeln("<form name='frm'>");

     writeln("<select name='selector' onchange='parent.cambiaSelector()'>");

     writeln(" <option" + (muestraTexto? "": " selected") + ">Combo solo</option>");

     writeln(" <option" + (muestraTexto? " selected": "") + ">Combo y texto</option>");

     writeln("</select>");

     writeln("<br>");

     if (muestraTexto){

      writeln("<input type='text' name='campoTexto' value='algo'>");

     }

     writeln("</form>");

     writeln("</body>\n</html>");

     close();

    }

   }

 
 
   document.writeln("<frameset rows='100%,*' onload='javascript:parent.formulario()'>");

   document.writeln("     <frame name='pantalla' src='DummyPage.htm'>");

   document.writeln("     <frame src=''>");

   document.writeln("</frameset>");

 
  </script>

 </head>

</html>

Kaopectate · #28 (**permalink**) 02/12/2002, 16:25

P: ¿Como puedo presentar una vista preliminar de los datos de mi formulario para que desde ella el usuario envíe o cancele el envío de dicho formulario?

R: [ver ejemplo]

Código PHP:

  <html>

 <head>

  <script language="JavaScript">

 
   function enviar(){

    //document.frm2.submit();

    alert("Documento enviado");

    history.back();

   }

 
   function regresar(){

    //document.frm2.submit();

    history.back();

   }

 
   function confirma(){

    var sNmb;

    sNmb = document.frm.nmb.value;

    sApe = document.frm.ape.value;

    sPrf = document.frm.prf.value;

    with (document){

     open();

     write("<html><head>");

     write(" </head><body><form name='frm2'>");

     write("   <table border='0'>");

     write("    <tr>");

     write("     <td>");

     write("      Nombre:");

     write("     </td>");

     write("     <td width='50' align='right'>");

     write(sNmb);

     write("     </td>");

     write("    </tr>");

     write("    <tr>");

     write("     <td>");

     write("      Apellido:");

     write("     </td>");

     write("     <td align='right'>");

     write(sApe);

     write("     </td>");

     write("    </tr>");

     write("    <tr>");

     write("     <td>");

     write("      Profesión:");

     write("     </td>");

     write("     <td align='right'>");

     write(sPrf);

     write("     </td>");

     write("    </tr>");

     write("    <tr>");

     write("     <td colspan='2' align='center'>");

     write("      <input type='submit' onclick='JavaScript:alert(" + '"' + "Documento enviado" + '"' + ");history.back()' value='Enviar estos valores'>");

     write("      <input type='button' onclick='JavaScript:history.back()' value='Volver sin enviar'>");

     write("     </td>");

     write("    </tr>");

     write("   </table>");

     write("</form></body></html>");

     close();

    }

   }

 
  </script>

 </head>

 <body>

  <form name="frm">

   <table border="1">

    <tr>

     <td>

      Nombre:

     </td>

     <td>

      <input type="text" name="nmb">

     </td>

    </tr>

    <tr>

     <td>

      Apellido:

     </td>

     <td>

      <input type="text" name="ape">

     </td>

    </tr>

    <tr>

     <td>

      Profesión:

     </td>

     <td>

      <input type="text" name="prf">

     </td>

    </tr>

    <tr>

     <td colspan="2" align="center">

      <input type="button" onclick="confirma()" value="Enviar">

     </td>

    </tr>

   </table>

  </form>

 </body>

</html>

chivi · #29 (**permalink**) 02/12/2002, 17:48

P: ¿Cómo puedo mostrar un texto(pregunta) tras seleccionar un radio button?

R:

Código PHP:

  <html>

<head>

<script>

function Pregunta1(){

document.getElementById('pregunta').innerHTML = "¿Cual es la pregunta 1?<br>"

document.form.texto.value = "Respuesta 1"}

function Pregunta2(){

document.getElementById('pregunta').innerHTML = "¿Cual es la pregunta 2?<br>"

document.form.texto.value = "Respuesta 2"}

function Pregunta3(){

document.getElementById('pregunta').innerHTML = "¿Cual es la pregunta 3?<br>"

document.form.texto.value = "Respuesta 3"}

function Pregunta4(){

document.getElementById('pregunta').innerHTML = "¿Cual es la pregunta 4?<br>"

document.form.texto.value = "Respuesta 4"}

</script>

</head>

<body>

<form name=form>

<input type="radio" name="Radio" value="Uno" Onfocus="Pregunta1()">Uno<br>

<input type="radio" name="Radio" value="Dos" Onfocus="Pregunta2()">Dos<br>

<input type="radio" name="Radio" value="Tres" Onfocus="Pregunta3()">Tres<br>

<input type="radio" name="Radio" value="cuatro" Onfocus="Pregunta4()">Cuatro<br>

<table border=0 cellpadding=0 cellspacing=0 width="100%" style="border-collapse: collapse" bordercolor="#111111">

<tr>

<td id="pregunta">Seleccione una Opción</td>

</tr>

<tr>

<td><input type="text" name="texto"></td>

</tr>

</table>

</form>

</body>

</html>

Kaopectate · #30 (**permalink**) 02/12/2002, 18:38

P: ¿Como puedo cerrar una ventana principal desde un botón sin que aparezca ningún mensaje de confirmación?

Créditos: Carlitos

Nota: Una versión mas sencilla y compatible con todas las plataformas puede ser encontrada en el FAQ-115.

R: [ver ejemplo]
El siguiente script se basa en una llamada a un OLE Object de Windows, lo que lo hace incompatible con otras plataformas.

Código PHP:

  <html>

 <!-- Aportado por: Carlitos -->

 <head>

  <script language="JavaScript">

   function salir(){

    close();

   }

  </script>

 </head>

 <body>

  <form name="frm">

   <input type="button" value="Cerrar con confirmación" onclick="salir()">

   <br>

   <object id="MyControl" type="application/x-oleobject" classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11" 

codebase="HHCTRL.ocx#Version=4,72,8252,0" width="100" height="100">

    <PARAM name="Command" value="Close">

    <PARAM name="Button" value="Text:Cerrar sin confirmación">

   </object>

  </form>

 </body>

</html>