put a load with jQuery on the button

Asked

Viewed 1,277 times

1

I have a very simple button, but I wanted to know if it is possible to load the button when it is clicked. I wanted to use jquery.

Follow the code of my button.

.button {
    margin-top: 12px;
    margin-right: 20px;
    border: 0;
    padding: 5px;
    width: 100px;
    height: 42px; 
    cursor: pointer;
    border-radius: 4px;
    color: #FFFFFF; 
  background-color: #FBBC05 !important;
}
<form name="form" action="#">
  <button type='submit' class="button">GERAR</button>
</form>

javascript jquery

1 answer

2


As for the button you could insert an image in by clicking.

$(".button").click(function() {
  $(this).html("<img src='http://cdn-frm-us.wargaming.net/4.5/style_images/wg/ajax_loading.gif' />");
});
.button {
  margin-top: 12px;
  margin-right: 20px;
  border: 0;
  padding: 5px;
  width: 100px;
  height: 42px;
  cursor: pointer;
  border-radius: 4px;
  color: #FFFFFF;
  background-color: #FBBC05 !important;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form name="form" action="#">
  <button type='submit' class="button">GERAR</button>
</form>

  • caramba turned out very good. Well I realized that you use the class '$(".button")', as I do for jquery to load the function in all tags '< button>'?

  • Switch to the selector $("button") @Hugoborges.

  • ok, and possible tbm disable the button after it is clicked?

  • $(this).prop("disabled",true);

Browser other questions tagged javascript jquery

You are not signed in. Login or sign up in order to post.