[Duda] Parámetros de una función javascript

MA40 · 5 Julio 2021, 12:10 PM

Hola.

Debe de ser algo muy elemental, pero ahora no caigo.

Tenemos este código HTML con una función javascript HolaMundo:

Código (html4strict) [Seleccionar]

<!DOCTYPE html>
<html>
  <head> 
    <script type="text/javascript">
    function HolaMundo(parametroMundo) {
      var variableHola = "Hola";
      alert(variableHola + " " + parametroMundo);
    }
    </script>
  </head>
  <body>
    <input type="button" value="Hola mundo" onclick="HolaMundo(123)">
  </body>
</html>

Introduciendo 123 como parámetro SÍ FUNCIONA, pero si en lugar de poner 123, ponemos "mundo", NO FUNCIONA.

Código (html4strict) [Seleccionar]

<!DOCTYPE html>
<html>
  <head> 
    <script type="text/javascript">
    function HolaMundo(parametroMundo) {
      var variableHola = "Hola";
      alert(variableHola + " " + parametroMundo);
    }
    </script>
  </head>
  <body>
    <input type="button" value="Hola mundo" onclick="HolaMundo("mundo")">
  </body>
</html>

¿Hay algo que estoy haciendo mal? ¿Es un error mío de concepto?

Gracias y un saludo.

MA40 · 5 Julio 2021, 12:24 PM

Y sin embargo así, SÍ FUNCIONA:

Código (html4strict) [Seleccionar]

<!DOCTYPE html>
<html>
  <head> 
    <script type="text/javascript">
    function HolaMundo(parametroMundo) {
      var variableHola = "Hola";
      alert(variableHola + " " + parametroMundo);
    }
    </script>
    <script type="text/javascript">
    function HolaMundoPasoIntermedio() {
      HolaMundo("mundo");
    }
    </script>
  </head>
  <body>
    <input type="button" value="Hola mundo" onclick="HolaMundoPasoIntermedio()">
  </body>
</html>

No tiene mucho sentido ¿no?

Un saludo.

#!drvy · 5 Julio 2021, 12:24 PM

Usas comillas dobles tanto para el html como para el JS. Eso causa un escape y la palabra "mundo" queda como referencia en vez de string.

O usa comillas simples, o escapas las dobles (recomiendo lo primero). Ese problema no lo tienes con el 123 porque no lo pasas como string.

Usar onclick ya se considera mala practica por lo general. Usa eventos en puro javascript. Igualmente, a no ser que sea 100% necesario, el javascript debe ir al final del body, no en el head.

Esta seria la solución a tu problema:

Código (html5) [Seleccionar]

<input type="button" value="Hola mundo" onclick="HolaMundo('mundo')">

Esto seria usando puro javascript para los eventos:

Código (html5) [Seleccionar]

<input type="button" value="Hola mundo" id="buttonHello">

Código (javascript) [Seleccionar]


document.getElementById('buttonHello').addEventListener('click', function() {
    HolaMundo('mundo');
});

Todo combinado:

Código (html5) [Seleccionar]

<html>
    <head></head>
    <body>
        <input type="button" value="Hola mundo" id="buttonHello">

        <script>
                function HolaMundo(parametroMundo) {
                    var variableHola = "Hola";
                    alert(variableHola + " " + parametroMundo);
                }

                document.getElementById('buttonHello').addEventListener('click', function() {
                    HolaMundo('mundo');
                });
        </script>
    </body>
</html>

https://developer.mozilla.org/es/docs/Web/API/Document/getElementById
https://developer.mozilla.org/es/docs/Web/API/EventTarget/addEventListener

Te recomiendo que revises algun tutorial de javascript ACTUALIZADO (maximo hace 3 años).

Saludos

Danielㅤ · 5 Julio 2021, 20:05 PM

Hola, como dice el compañero tenés que escapar tu string, pero puede pasar que en algún momento necesites pasar las comillas dobles como parte del string, en tu caso sería:

Código (javascript) [Seleccionar]


    <input type="button" value="Hola mundo" onclick="HolaMundo(\"mundo\")">

Y si quisieras pasar las camillas dobles podes hacerlo así:

Código (javascript) [Seleccionar]


    <input type="button" value="Hola mundo" onclick="HolaMundo(\"\"mundo\"\")">

Saludos

Test Foro de elhacker.net SMF 2.1

[Duda] Parámetros de una función javascript

MA40

MA40

#!drvy

Danielㅤ