jQuery Mobile Page beforecreate Event

jQuery Mobile es un conjunto de sistemas de interfaz de usuario basados ​​en HTML5 construidos sobre jQuery que se utiliza para desarrollar sitios web a los que se puede acceder en dispositivos de varios tamaños de pantalla, como teléfonos inteligentes, tabletas, computadoras de escritorio y portátiles.

En este artículo, usaremos la página de jQuery Mobile antes de crearevento que se activa antes de la creación del widget de página.

Sintaxis:

Inicialice la página con la devolución de llamada beforecreate especificada.

  •  
$( ".selector" ).page({
  beforecreate: function( event, ui ) {
      // Your code here.
  }
});

Vincule un detector de eventos al evento pagebeforecreate .

  •  
$(".selector").on( "pagebeforecreate", function( event, ui ) {} );

Parámetros: Acepta una función de devolución de llamada que tiene dos parámetros.

  • evento: Acepta valor de tipo Evento .
  • ui: acepta el valor del tipo de objeto . El objeto ui puede estar vacío pero se puede usar para mantener la coherencia con otros eventos en la biblioteca.

Enlaces CDN:

<enlace rel=”hoja de estilo” href=”https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css” />
<script src=”https://code .jquery.com/jquery-2.1.3.js”></script>
<script src=”https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.js”> </script>

Ejemplo: El siguiente ejemplo demuestra el uso de la página antes de crear un evento. Vinculamos un detector de eventos al evento pagebeforecreate que abre un cuadro de alerta cuando se activa el evento.

HTML

<!DOCTYPE html>
<html lang="en">
 
<head>
    <meta charset="utf-8">
    <meta name="viewport" content=
          "width=device-width, initial-scale=1">
 
    <link rel="stylesheet" href=
"https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
    <script src=
 "https://code.jquery.com/jquery-2.1.3.js">
    </script>
    <script src=
 "https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.js">
    </script>
 
    <script>
        $(document).on("pagebeforecreate", function (event, ui) {
            alert("Page beforecreate event triggered.");
        });
    </script>
</head>
 
<body>
    <div id="#page1" data-role="page">
        <div data-role="header">
            <h1 style="color:green;">GeeksforGeeks</h1>
            <h3>jQuery Mobile Page beforecreate event</h3>
        </div>
 
        <div role="main" class="ui-content">
            <center>
                <h2>What is GeekforGeeks?</h2>
                <p style="padding: 0px 20px">
                    GeeksforGeeks is a computer science
                    portal for geeks by geeks. Here
                    you can find articles on various
                    computer science topics like Data
                    Structures, Algorithms and many more.
                    GeeksforGeeks also provide courses,
                    you can find the courses at
                    <a href="https://practice.geeksforgeeks.org/courses">
                      https://practice.geeksforgeeks.org/courses</a>
                </p>
 
 
                <p class="do-not-toggle-on-tap">
                    For cracking interviews of top product
                    based companies, you need to
                    have good and deep understanding of
                    topics like DSA, System design etc.
                    GeeksforGeeks provide you quality
                    content so that you can prepare for
                    the interviews. GeeksforGeeks also
                    have a practice portal where you
                    can practice problems and brush
                    on your skills. You can visit the
                    practice portal at
                    <a href="https://practice.geeksforgeeks.org">
                      https://practice.geeksforgeeks.org
                    </a>
                </p>
 
            </center>
        </div>
    </div>
</body>
</html>

Producción:

jQuery Mobile Page beforecreate Event

Referencia: https://api.jquerymobile.com/page/#event-beforecreate

Publicación traducida automáticamente

Artículo escrito por vpsop y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *