form submit jquery v javascript difference

Question

in javascript this works fine and the validateForm function fires

ContactForm = document.getElementById('EmailForm');
ContactForm.onsubmit=validateForm;

function validateForm() {
   //do stuff here
}

but why doesnt a similar implementation of the same code in jquery not work? This is what I would like to do

ContactForm = $('#EmailForm');
ContactForm.submit=validateForm;

function validateForm() {
   //do stuff here
}

after reading http://api.jquery.com/submit/ the following code works

ContactForm = $('#EmailForm');
ContactForm.submit(function() {
   //do stuff here
});

why does the submit method require a function to wrap around the code im trying to fire. why can i not just call the function directly as native javascript does??

thanks in advance

Answer 1

Because jquery objects are wrapper around javascript objects. And jquery objects expose another set of methods to work with the underlying javascript objects. onsubmit is a property of the underlying javacript object, but jquery object does not have it. When you call

ContactForm.submit(function() {
   //do stuff here
});

The submit function of the jquery object will register the submit event for the underlying javascript object