Behavior of jQuery bind() when using namespace

Question

Currently I'm dealing with namespaces in javascript. As a first step I build a test page.

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Namespace</title>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
var NSVB = NSVB || {};
NSVB.sub = {
  init: function(){
    alert("NSVB rocks");
    $("#click-test").bind("click",NSVB.sub.clicktest());
  },
  clicktest: function(){
    alert("clicked");
  }
}

NSVB.sub.init = function(){
  alert("NSVB rocks overwirtten");
  $("#click-test").bind("click",NSVB.sub.clicktest());
}

$(document).bind("load", NSVB.sub.init());
</script>
</head>
<body>
    <p id="click-test">click to test</p>
</body>
</html>

What I expect my code to do is:

define the namespace with the function init() and clicktest()
overwrite the function init()
handle click event on #click-test when I click it

What my Code does:

define the namespace with the function init() and clicktest()
overwrite the function init()
call clicktest()
when I click nothing happens!!

I really don't get it! Hope someone could help.

Thanks in advance.

EDIT

After some testing I've have done the following:

Remove parenthesis

$("#click-test").bind("click",NSVB.sub.clicktest);

Replace

$(document).bind("load", NSVB.sub.init);

With (one of them, what you prefer to use)

document.addEventListener("DOMContentLoaded",NSVB.sub.init,false);

or

$(document).ready(function(e) {
NSVB.sub.init();
});

Everything works fine and as expected!

Denys Séguret · Accepted Answer · 2013-07-03 08:12:05Z

1

You didn't bind the function but the result of the function, that is nothing.

Change

$(document).bind("load", NSVB.sub.init());

to

$(document).bind("load", NSVB.sub.init);

You have the same problem elsewhere (except of course if NSVB.puzzle.clicktest() returns a function):

    $("#click-test").bind("click",NSVB.puzzle.clicktest());

answered Jul 3, 2013 at 8:12

Denys Séguret

384k90 gold badges813 silver badges780 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Dennis Dittert Over a year ago

I've tested your changes, but now nothing happens! In my example the function init() was called as expected, but the function clicktest() was called immediately and not when I click #click-test.

Denys Séguret Over a year ago

No, your function init() wasn't called as expected, it was called immediately, before the document loads. What I meant for the #click-test problem is that you must remove the parenthesis : $("#click-test").bind("click",NSVB.puzzle.clicktest);. Whether it will work will depend on the content of this function of course.

Dennis Dittert Over a year ago

Ok, now I'm totally confused!! I've removed the parenthesis as you said! But, init() will not be called on load. But when i do this document.addEventListener("DOMContentLoaded",NSVB.sub.init,false); everything is fine!?!?

Collectives™ on Stack Overflow

Behavior of jQuery bind() when using namespace

EDIT

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

EDIT

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related