Cuando se escribe un complemento de jQuery, se debe implementar la misma rutina de prevención de conflictos que se usa con el código jQuery antiguo y regular. Con esto en mente, todos los complementos deben estar contenidos dentro de un ámbito privado donde el PS
Se puede usar un alias sin temor a conflictos o resultados sorprendentes..
La estructura de codificación a continuación debe ser familiar, ya que se usa en casi todos los ejemplos de código en esta sesión.
Se adjuntan nuevos complementos a la jQuery.fn
objeto, ya que se trata de un acceso directo o alias para jQuery.prototype
. En nuestro ejemplo de codificación a continuación, estamos agregando el complemento de recuento a la jQuery.fn
objeto. Al hacer esto, estamos creando nuestro propio método jQuery personalizado que se puede usar en un conjunto envuelto de elementos DOM.
Básicamente, un plugin adjunto a jQuery.fn
nos permite crear nuestros propios métodos personalizados similares a los que se encuentran en la API. Esto se debe a que cuando adjuntamos nuestra función de plugin a jQuery.fn
, Nuestra función está incluida en la cadena de prototipos.-$ .fn.count = function ()
-para objetos jQuery creados usando la función jQuery. Si eso te sorprende, solo recuerda que agregar una función a jQuery.fn
significa que la palabra clave esta
Dentro de la función de complemento se referirá al objeto jQuery en sí..
Notas: Añadiendo un plugin a la jQuery.fn
objeto, básicamente estamos diciendo que a nuestro complemento le gustaría usar la función jQuery para seleccionar un contexto (elementos DOM). Si su complemento no requiere un contexto específico (en otras palabras, un conjunto de elementos DOM) en el que necesita operar, es posible que no necesite adjuntar este complemento a la $ .fn
. Podría tener más sentido agregarlo como una función de utilidad en el espacio de nombres jQuery.
esta
Es una referencia al objeto jQuery actualCuando adjuntas un plugin a la jQuery.fn
objeto, la palabra clave esta
utilizado dentro de la función de complemento adjunto se referirá al objeto jQuery actual.
Es crítico que usted asimile exactamente cuál es la palabra clave esta
se refiere a en la función de plugin.
esta
Palabra claveUtilizando cada()
, Podemos crear una iteración implícita para nuestro complemento. Esto significa que si el conjunto de envoltura contiene más de un elemento, nuestro método de complemento se aplicará a cada elemento del conjunto de envoltura.
Para ello, utilizamos la utilidad jQuery. cada()
La función, que es un iterador genérico para ambos objetos y matrices, básicamente simplifica el bucle. En el ejemplo de código a continuación, usamos la función para iterar sobre el objeto jQuery. Dentro de la función que se pasa a cada()
, la palabra clave esta
se referirá a los elementos en el conjunto de envoltura jQuery.
Utilizando la cada()
la función es crítica si desea que un complemento emplee una iteración implícita.
Normalmente, la mayoría de los complementos devuelven el objeto jQuery en sí mismo para que el complemento no rompa la cadena. En otras palabras, si un complemento no necesita específicamente devolver un valor, debe continuar la cadena para que se puedan aplicar métodos adicionales al conjunto de envoltura. En el siguiente código, estamos devolviendo el objeto jQuery con el devuelve esto
Declaración para que el encadenamiento no se rompa. Note que estoy encadenando en el padre()
y adjuntar()
métodos después de que llame a la contar()
enchufar.
Notas: Es posible hacer que el complemento sea un método destructivo simplemente no devolviendo el objeto jQuery.
Los complementos normalmente contienen opciones predeterminadas que actuarán como la configuración predeterminada de línea de base para la lógica de los complementos. Estas opciones se utilizan cuando se invoca el complemento. En el siguiente código estoy creando un defaultOptions
objeto que contiene una sola propiedad (startCount)
y valor (0
). Este objeto se almacena en la función de conteo. $ .fn.count.defaultOptions
. Hacemos esto para que las opciones sean configurables desde fuera del complemento..
Normalmente, las opciones de complemento predeterminadas se pueden sobrescribir con opciones personalizadas. En el código de abajo, paso en un customOptions
Objeto como parámetro a la función de complemento. Este objeto se combina con el defaultOptions
objeto para crear un solo opciones
objeto. Utilizamos el método de utilidad jQuery. ampliar()
para combinar varios objetos en un solo objeto. los ampliar()
El método proporciona la utilidad perfecta para sobrescribir un objeto con nuevas propiedades. Con este código en su lugar, el complemento ahora se puede personalizar cuando se invoca. En el ejemplo, pasamos el contar
agregue un número personalizado (500) que se utilizará como punto de partida para el conteo. Esta opción personalizada anula la opción predeterminada (0).
Dado que las opciones predeterminadas son accesibles desde fuera de un complemento, es posible restablecer las opciones predeterminadas antes de invocar el complemento. Esto puede ser útil cuando desea definir sus propias opciones sin alterar el código del complemento. Al hacerlo, puede simplificar las invocaciones de complementos porque, en cierto sentido, puede configurar globalmente el complemento a su gusto sin forzar el código original del complemento..
Dependiendo de la naturaleza del complemento, puede ser crítico que un complemento se llame normalmente (a través de elementos y eventos de DOM), así como mediante programación. Considere un complemento de diálogo. Habrá momentos en que el modal / diálogo se abrirá en función de los eventos del usuario. Otras veces, será necesario abrir un cuadro de diálogo basado en eventos ambientales o del sistema. En estas situaciones, puede invocar su complemento sin ningún elemento en el DOM creando un elemento sobre la marcha para invocar el complemento. En el código de abajo, invoco el diálogo()
complemento en la carga de la página creando primero un elemento para invocar mi complemento.
diálogo di hola di adiós
Obviamente, podría haber muchas variaciones de este patrón dependiendo de las opciones, la complejidad y la funcionalidad del complemento. El punto aquí es que los complementos se pueden llamar a través de elementos DOM existentes, así como aquellos creados sobre la marcha.
Al crear complementos de jQuery, es una buena idea proporcionar funciones de devolución de llamada como una opción, y pasar estas funciones al contexto de esta
cuando se invoca la devolución de llamada. Esto proporciona un vehículo para el tratamiento adicional de los elementos en un conjunto de envoltura. En el siguiente código, estamos pasando una opción personalizada al outAndInFade ()
Método de complemento que es una función y se debe llamar una vez que se complete la animación. La función de devolución de llamada se pasa el valor de esta
cuando se está invocando. Esto nos permite luego usar el esta
Valor dentro de la función que definimos. Cuando se invoca la función de devolución de llamada, la palabra clave se referirá a uno de los elementos DOM contenidos en el conjunto de envoltura.
Fuera y en desvanecimientoFuera y en desvanecimiento