informaticaPC

Tutorial de JQuery

Botones


Regístrate

Los datos recopilados tienen como finalidad el envío de novedades sobre contenidos formativos propios (tanto en modalidad gratuita como de pago) y de terceros en calidad de afiliado, así como también noticias, información y otros contenidos relacionados con la informática y las nuevas tecnologías, siendo responsable de dicha información Francisco Javier Medina Medina (propietario de InformaticaPC.com).
Al obtener tu consentimiento los datos serán almacenados en el proveedor de E-Mail marketing MailRelay.
Por supuesto, en cualquier momento podrás hacer uso de tus derechos para acceder, rectificar, limitar y suprimir dichos datos.

Button (botón)

Este componente permite crear botones más personalizables (con la capacidad de tomar la configuración del theme activo), permitiéndonos crear una barra de herramientas.

Sus propiedades son:

  • disabled: muestra u oculta el botón.
  • icons: permite mostrar iconos.
  • label: especifica el texto del botón.
  • text: permite mostrar u ocultar el texto definido en la propiedad anterior.

Entre otros dispone de los siguientes métodos:

  • enable(): muestra el botón.
  • disable(): lo desactiva.

Veamos con un ejemplo:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

  <head>
    <title>InformaticaPC | botones con JQuery UI</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

    <style type="text/css">
        body { background-color:lightyellow;font-family:Arial;font-size:10pt; }
    </style>

    <!-- Observa que agregamos también la librería JQuery UI -->
    <script type="text/javascript" src="../lib/jquery-1.9.1.min.js"></script>
    <script type="text/javascript" src="../lib/jquery-ui-1.10.1.custom.min.js"></script>

    <!-- Agregamos también el archivo CSS del theme que usemos -->
    <link type="text/css" rel="stylesheet" href="../lib/css/smoothness/jquery-ui-1.10.1.custom.css" />

    <script type="text/javascript">

        $(document).ready(function()
        {
            $("#boton").click(function(){
                $("#boton").button();
                $("#enlace").button();
            })
        });

    </script>
  </head>

  <body>

      <input type="button" id="boton" value="Pulsa aquí" />
      <a id="e" href="#">Esto es un enlace</a>

  </body>

</html>

Ejemplo

Más información

Vea también: [ Button ] - [ Button (ejemplo) ]

Primera página Página anterior Siguiente Última página
Usamos cookies para ofrecerte una experiencia mejorada, el continuar navegando supone que aceptas su uso