CODEWITHSUNDEEP
javascriptdom
thisjt
thisjt

Reputation: 344

JavaScript - Binding a function to an Event to an element returns an error?

I don't know what's wrong here, but what do you think is wrong?

I have this very simple JavaScript function, which, when executed directly to the Inspect Element console works perfectly, but when I bind it to an event, then it returns the error "Uncaught TypeError: object is not a function". What do you think is wrong here?

Here's the function.

var pass_sh_busy = 0;
var pass_sh = function(y) {
if(pass_sh_busy) {
        document.getElementById('pass_sh').type = 'password';
        document.getElementById('pass_sh').placeholder = '********';
        pass_sh_busy = 0;
    } else {
        pass_sh_busy = 1;
        document.getElementById('pass_sh').type = 'text';
        document.getElementById('pass_sh').placeholder = 'password';
    }
}

pass_sh is this...

<input name="rass" id="pass_sh" placeholder="*********" type="password">

Here's my binded element.

<input style="width:5%" type="button" onclick="pass_sh()">

This is a very weird error I think. What do you think is wrong here?

Upvotes: 1

Views: 98

Answers (1)

Felix Kling
Felix Kling

Reputation: 816322

The problem is that you have an element with ID pass_sh. Elements with IDs will create global variables with the ID referring to that element. So pass_sh inside the HTML attribute seems to refer to the DOM element instead of your function.

Either give the element a different ID or your function a different name.

FYI, there are more flexible ways to bind event handlers.

Upvotes: 1

Related Questions