Why .load is binding event?

I'm doing this:

return this.each(function(){
    $.this.load('searchInterface.html',function(){
        console.log('load');
        //a lot of code
    });
    $('#more_button').bind('click',more());

    function more(){
        console.log('more');
    }
});

And my console is showing:

more

load

That means that somewhere inside .load(), something is clicking on my button. How can I avoid this be开发者_StackOverflow中文版havior?

Thanks!

Declare more above the line that reads $('#more_button').bind('click',more()); and remove the parentheses.

You should be referencing the function, not invoking it.

$('#more_button').bind('click',more);

You are calling the more function. Use:

function more(){
    console.log('more');
}

$('#more_button').bind('click',more);

By including the parentheses, you are calling the more() function rather than passing the reference to id.

Use this instead

$('#more_button').bind('click',more);