[secag]

Hej,

Jag har sökt runt lite men inte hittat något bra svar på om man kan använda jQuery i vanliga javascriptfunktioner som detta:

function nextQuestion(o) {
$(document).ready(function() {
// jQuery-kod
});
}

[Monkboll]

självklart... jquery är ju javascript...

[jlg]

$(document).ready(function() {

function next_question() {
// Do some shit
}

$('.next').on('click', function(e) {
e.preventDefault();
next_question();
});

});

[dAEk]

Som jlg är inne på är det bättre att vända på koden och inte smutsa ned/sprida en massa $(document).ready-kod i ens egna funktioner. Det finns ju ingen vinst med att kolla document ready i varje metod, snarare tvärtom; koden blir rörigare och dagen då jQuery skall bytas ut blir det ett helvete att uppdatera alla metoder där document ready kollas.

Använder du inget ramverk som knockout kan det vara en bra idé att strukturera upp koden så att document ready körs på så få ställen som möjligt. Det kan du uppnå genom att t.ex. skapa en klass på följande sätt:

var AutoSaver = function (config) {
	var _interval = config.interval;
	var _url = config.url;
	var _lastSavedContent = null;
	var _instanceId = null;

	var start = function () {
		if (_instanceId == null) {
		    _instanceId = window.setInterval(saveChanges, _interval);
		    
		    if (this.debug)
				console.log("Started the autosaving listener.");
		}
	};

	var stop = function () {
		if (_instanceId != null) {
			window.clearInterval(_instanceId);
			_instanceId = null;

			if (this.debug)
				console.log("Stopped the autosaving listener.");
		}
	};
	
	var init = (function () {
		//TODO: hooka upp dina jQuery event-lyssnare och delegates här (utan att kolla document ready).
	})();

	return {
		start: start,
		stop: stop
	};
};

På sidan där du vill använda en autosaver gör du helt enkelt document ready-kollen och skapar dig en instans av autosavern:

$(document).ready(function() {
    var autosaver = new AutoSaver({
        //TODO: ange parametrar som skall användas.
    });
    autosaver.start();
});

Det som kan vara lite bökigt att få grepp om är init-funktionen. Den agerar konstruktor i det här fallet och kör sig själv varje gång det skapas en ny instans av AutoSaver.

Koden är tagen från ett projekt på jobbet men jag har tagit bort en massa för att hålla exemplet kort. Man kan säkert förbättra det på flera sätt men jag tycker att upplägget funkar hyfsat och det borde inte vara så svårt att förstå sig på.

Javascript är väldigt lätt att göra rörigt och en mardröm att underhålla om man kodar utan att ha någon strategi i bakhuvudet. Jag rekommenderar starkt att man kapslar in ens egen kod i klasser. Det positiva är att det är lätt att lära sig och enkelt att testa olika koncept. Nuförtiden finns det dessutom ramverk som hjälper till med detta.