停止默认的提交操作并触发对动态生成内容的自定义单击

Question

I am using leadpages.net for building popups for my site. They provide an anchor link and a script file source to get the popup on your page. I want to stop default action of form submission and fire my custom click event handler for processing data input as shown below.

But below never gets executed; tried all variations with the below code, even included event.preventDefault() and event.stopPropagation(). Please help; any insights what I am might be lacking. Thanks in advance!!!

$('body').on('click', '#leadpages-form', function(event) {
    event.preventDefault();
    event.stopPropagation();
    console.log("here");
});

Answer 1

You're currently listening for a click on the form, not for the form to submit . Try something like this.

$('#leadpages-form').submit(function(event) {
    event.preventDefault();
    event.stopPropagation();
    console.log("here");
});

Or, if your form is created dynamically, you'll have to do it similarly to your example.

//or document if the body is created dynamically as well
$('body').on('submit', '#leadpages-form', function(event) {
    event.preventDefault();
    event.stopPropagation();
    console.log("here");
});