Cancelling ajax on submit

by IwanVosloo

HTML

<form>
    <input id="in" type="text" placeholder="stuff"/>
    <button id="but1" class="callback" type="button">Click me</button>
</form>

JavaScript

function initializeAjaxQueue() { 
		var ajaxqueue = {
			cancelled: false,
			cancel: function() { this.cancelled = true; },
			schedule: function(f, element) {  
				var _this = this;
				setTimeout(function(){ if (!_this.cancelled) { f.call(element) } }, 0);
			}
		};
		jQuery("form")
			.data("ajaxqueue", ajaxqueue)
			.submit(ajaxqueue.cancel)
			.on("mousedown", ".callback", ajaxqueue.cancel);
};
initializeAjaxQueue();

$("#in").change(function(event){
    jQuery('form').data("ajaxqueue").schedule(function(){console.log("ajax fired");});
})

/*$(".callback").mousedown(function(){
    jQuery('form').data("ajaxqueue").cancel();
});*/

$("#but1").click(function(){
    console.log('clicked');
});