0

Estoy tratando de verificar si el acceso de los usuarios se realiza por computadora de escritorio o móvil. Para esto, estoy hacienda lo siguiente:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
<script>
function checkDevice() {
    var texto = ""; 
    if( navigator.userAgent.match(/Android/i)
    || navigator.userAgent.match(/webOS/i)
    || navigator.userAgent.match(/iPhone/i)
    || navigator.userAgent.match(/iPad/i)
    || navigator.userAgent.match(/iPod/i)
    || navigator.userAgent.match(/BlackBerry/i)
    || navigator.userAgent.match(/Windows Phone/i)
    ){
       texto = "<h1>ACESSO PELO CELULAR</h1>";
       
    }
     else {
        texto = "<h1>ACESSO PELO DESKTOP</h1>";
    }
document.getElementById("divResultado").innerHTML = texto;
}
</script>

<div id="divResultado" onload="checkDevice()"></div>
</body>
</html>

Me gustaría que apareciera un mensaje en la pantalla del usuario, pero no aparece, se Vuelve blanco. No sé mucho Javascript y perdono mi español.

2 respuestas 2

2

El problema lo tienes en el onload del div, no es necesario ya que quieres que se cargue al iniciar la página. Esta es una mejora con el tema del regex cuando buscas el tipo de dispositivo y la llamada a la función cuando carga la página.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      function checkDevice() {
        var texto = '';

        if (
          /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
            navigator.userAgent
          )
        ) {
          texto = '<h1>ACESSO PELO CELULAR</h1>';
        } else {
          texto = '<h1>ACESSO PELO DESKTOP</h1>';
        }

        document.getElementById('divResultado').innerHTML = texto;
      }
      checkDevice();
    </script>

    <div id="divResultado"></div>
  </body>
</html>
1

Bom dia! El problema es que el evento onload no se puede usar en divs. Además, debes poner el script al final

Recuerda que también puedes usar Stack Overflow en Portugués si se dificulta hablar español.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body onload="checkDevice()">


<div id="divResultado"></div>
</body>

<script>
function checkDevice() {
    var texto = ""; 
    console.log(navigator.userAgent);
    if( navigator.userAgent.match(/Android/i)
    || navigator.userAgent.match(/webOS/i)
    || navigator.userAgent.match(/iPhone/i)
    || navigator.userAgent.match(/iPad/i)
    || navigator.userAgent.match(/iPod/i)
    || navigator.userAgent.match(/BlackBerry/i)
    || navigator.userAgent.match(/Windows Phone/i)
    ){
       texto = "<h1>ACESSO PELO CELULAR</h1>";
       
    }
     else {
        texto = "<h1>ACESSO PELO DESKTOP</h1>";
    }
document.getElementById("divResultado").innerHTML = texto;
}
</script>
</html>

1
  • Muchas gracias Marcelo. Sí, pero encuentro más ayuda aquí que allá :)
    – JM_2021
    Commented el 1 feb. 2023 a las 12:12

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.