两个功能的Javascript按钮。 提交和点击

Question

We are trying to link our form's submit button to work as a submit button and function the following Javascript.

Button:

<button type="submit" id="btn_submit" class="button button--red">Sign Up</button>

It works when we remove the id="btn_submit" to submit, but when we add the id="btn_submit" it implements the Javascript. How could we have the one button achieve both functions?

Javascript (beginning):

$("#btn_submit").on('click', function() {

Many, Many thanks!

Answer 1

$("#btn_submit").on('click', function(e) { 
e.preventDefault(); //prevent the form from submitting
//do your code here
$('form#myForm').submit(); //submit your form here

One way to do this is dont submit your form on button click after doing all the other code you can submit your form manually

Answer 2

$("#btn_submit").on('click', function(e) {
    e.preventDefault();

    //do stuff

    $("#form").submit();
}

Where "#form" represents the id of your form. So if your form is "my_form", then change the above to read $("#my_form").submit();