jQuery event method(2)

1.one(): Attach one or more event handlers to the selected element and specify a function to run when the event occurs.

When using the one() method, the event handler function can only be run once per element

 

$("p").one("click",function(){
  $(this).animate({fontSize:"+=6px"});
});//When the p element is clicked, increase the text size of the element:

 2.ready(): The ready event occurs when the DOM (Document Object Model) has been loaded and the page (including images) has been fully rendered.

$(document).ready(function(){
  $(".btn1").click(function(){
    $("p").slideToggle();
  });
});

 3. resize() : The resize event occurs when the browser window is resized.

$(window).resize(function() {
  $('span').text(x+=1);
});

 4. scroll(): The scroll event occurs when the user scrolls the specified element.

$("div").scroll(function() {
  $("span").text(x+=1);
});

 5. select(): The select event occurs when text in an input element of type textarea or text is selected.

$("input").select(function(){
  $("input").after(" Text marked!");
});

 6. submit(): The submit event occurs when the form is submitted.

$("form").submit(function(e){
  alert("Submitted");
});

 7. toggle(): Used to bind two or more event handler functions to respond to the alternate click events of the selected element.

 

 

$("p").toggle(
  function(){
  $("body").css("background-color","green");},
  function(){
  $("body").css("background-color","red");},
  function(){
  $("body").css("background-color","yellow");}
);

 8. trigger(): The specified event type that triggers the selected element.

$(document).ready(function(){
  $("input").select(function(){
    $("input").after("Text is selected!");
  });
  $("button").click(function(){
    $("input").trigger("select");
  });
});

The triggerHandler() method triggers the specified event type for the selected element. But no browser default actions are performed, and no event bubbling occurs.

The triggerHandler() method is similar to the trigger() method. The difference is that it doesn't fire the default behavior of events (like form submit), and only affects the first matching element.

9. unbind() : Remove the event handler of the selected element. This method can remove all or selected event handlers, or terminate the execution of the specified function when the event occurs.

$(document).ready(function(){
  $("p").click(function(){
    $(this).slideToggle();
  });
  $("button").click(function(){
    $("p").unbind();
  });
});

 10.unload(): When the user leaves the page, the unload event will occur, which only applies to the window object.

      Specifically, the unload event is emitted when:

• Click on a link that leaves the page
• Typed a new URL in the address bar
• Use the forward or back buttons
• close the browser
• reload page

$(window).unload(function(){
  alert("Goodbye!");
});