events.js 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129
  1. $( "#especial" ).click(function() {
  2. alert( "Has pulsado sobre un párrafo" );
  3. });
  4. $( "#especial" ).on( "click", function() {
  5. alert( "Has hecho click sobre un párrafo" );
  6. });
  7. $( "#no-especial" ).click(holaMundo).mouseenter(holaMundo2);
  8. function holaMundo() {
  9. alert("Hola Mundo");
  10. }
  11. function holaMundo2() {
  12. alert("Hola Mundo2");
  13. }
  14. $( "#no-especial" ).on( "click mouseenter", function() {
  15. alert( "Has hecho click o has pasado por encima de un párrafo" );
  16. });
  17. $( "#pulsar-p" ).on({
  18. mouseover: function() {
  19. alert( "Has pasado por encima de un párrafo" );
  20. },
  21. click: function(event) {
  22. alert( "Has hecho click sobre un párrafo" );
  23. event.stopPropagation();
  24. },
  25. mouseleave: function() {
  26. alert("Has abandonado el párrafo");
  27. }
  28. });
  29. $( "#hola" ).on( "click", {
  30. foo: "hola"
  31. }, function( event ) {
  32. alert( "Párrafo hola dice: " + event.data.foo );
  33. });
  34. $( "#adios" ).on( "click", {
  35. foo: "adios"
  36. }, function( event ) {
  37. alert( "Párrafo adios dice: " + event.data.foo );
  38. });
  39. $( document ).ready(function(){
  40. $(".alert").click(function(){
  41. alert("Has pulsado un botón con alert jeje");
  42. $( "<button class='alert'>Alert!</button>" ).appendTo( "#alert-buttons" );
  43. });
  44. });
  45. $( document ).ready(function(){
  46. $( "#alert-buttons2" ).on( "click", ".alert2", function() {
  47. alert("Has pulsado un botón con alert jeje");
  48. $( "<button class='alert2'>Alert!</button>" ).appendTo( "#alert-buttons2" );
  49. });
  50. });
  51. $( document ).ready(function(){
  52. $( "#b-unico" ).one( "click", function() {
  53. alert("Solo me puedes pulsar una vez, lo siento");
  54. });
  55. });
  56. $( document ).ready(function(){
  57. $( "#b-nounico" ).one( "click", firstClick);
  58. });
  59. function firstClick() {
  60. alert( "Me puedes pulsar más veces!!!!!" );
  61. // Ahora creamos un nuevo controlador para el botón
  62. $( this ).click( function() { alert( "Te lo dije, púlsame todas las veces que quieras!" ); } );
  63. }
  64. $( document ).ready(function(){
  65. $( "#hola-b" ).click(holaClase);
  66. $("#poner-hola").click(function() {
  67. $("#hola-b").on("click", holaClase);
  68. });
  69. $("#quitar-hola").click(function() {
  70. $("#hola-b").off("click");
  71. });
  72. });
  73. function holaClase() {
  74. alert("Hola");
  75. }
  76. $( document ).ready(function(){
  77. $( "#hola-b2" ).click(holaClase).mouseenter(holaClase);
  78. $("#poner-hola2").click(function() {
  79. $("#hola-b2").on("click", holaClase);
  80. });
  81. $("#quitar-hola2").click(function() {
  82. $("#hola-b2").off("click mouseenter");
  83. });
  84. });
  85. $( document ).ready(function(){
  86. $( ".onefun" ).hover(function() {
  87. $( this ).fadeOut( 100 );
  88. $( this ).fadeIn( 500 );
  89. });
  90. $( ".twofun" ).hover(
  91. function() {
  92. $( this ).append( $( "<span> ***</span>" ));
  93. }, function() {
  94. $( this ).find( "span:last" ).remove();
  95. }
  96. );
  97. });
  98. $(function() {
  99. $( "#google" ).click(function( event ) {
  100. event.preventDefault();
  101. alert("NO");
  102. });
  103. });