javascript - Structure application by using jQuery -
javascript - Structure application by using jQuery -
i going build application not much rich otherwise can utilize angularjs purpose. wanted organize js code proper modular programming approach.
e.g
var signupmodule = { elem: $('#id'), // unable access jquery object here init: function (jquery) { alert(jquery('.row').html()); } }; var application = { modules: [], addmodule: function (module) { this.modules.push(module); }, run: function (jquery) { _.each(this.modules, function (module) { //iterate each module , run init function module.init(jquery); }); } } jquery(document).ready(function () { application.addmodule(signupmodule);//add module execute in application application.run(jquery);//bootstrap application });
please @ have updated question actual code
the biggest error you've done using anonymous first parameter of anonymous function taken $.each
method. first argument index, , sec argument element looking for. below can find working code.
and no, don't need pass jquery
object everywhere. it's global. is everywhere. can see in code below.
class="snippet-code-js lang-js prettyprint-override">var signupmodule = { elem: $('.row'), //jquery works fine here init: function () { alert(this.elem.html()); } }; var application = { modules: [], addmodule: function (module) { this.modules.push(module); }, run: function () { $.each(this.modules, function (index, module) { //this function takes 2 parameters //iterate each module , run init function module.init(); }); } } //document.ready $(function () { application.addmodule(signupmodule);//add module execute in application application.run();//bootstrap application });
class="snippet-code-html lang-html prettyprint-override"><script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="row">alert <b>me!</b></div>
javascript jquery modular-design
Comments
Post a Comment