Using function that uses 'this' keyword not working as expected

Question

Title may not be correct but i didnt know how to ask my question ! I have encountered a problem with this keyword . While using it as in this code <input type="text" onkeyup="this.value=this.value.toUpperCase();"></input> it works perfectly. But when i allot a function on input element that uses this keyword , it dont work as in
HTML

<input type="text" ></input>

Javascript

var inp=document.getElementsByTagName('input')[0];
inp.onkeyup=up;
function up()
{   
    this.value=this.value.toUpperCase();
}

No, it's not working ,that's why i have asked the question @nikhil — pradeep Arora, Jul 18 '15 at 10:53
As per the code provided, it is working. You can verify in the fiddle shared. There seems to be some other issue if it is not working. — Nikhil Aggarwal, Jul 18 '15 at 10:56
What's the error you are getting? "*it don't work*" is not helpful. — Bergi, Jul 18 '15 at 14:17

score 0 · Answer 1 · answered Jul 18 '15 at 10:44

0

Can you bind onkeyup event in HTML? If yes then use this code:

<script>
function up(element) {   
    element.value = element.value.toUpperCase();
}
</script>
<input type="text" onkeyup="up(this)"></input>

answered Jul 18 '15 at 10:44

Keammoort

3,035
15
20

yeah this is working , but can u tell what is the problem with that code ? @keammoort – pradeep Arora Jul 18 '15 at 10:54

score 0 · Answer 2 · answered Jul 18 '15 at 13:36

How about taking it off of the global scope? Try binding in an IIFE:

    (function bindEventHandler(tag) {

        var inp = document.getElementsByTagName(tag)[0];

        inp.onkeyup = function up() {   
            this.value=this.value.toUpperCase();
        };
    }('input'));

score 0 · Answer 3 · answered Jul 18 '15 at 13:58

0

If you do it this way, make sure to add the script at the end of your body tags, and then it'll work.

answered Jul 18 '15 at 13:58

Alexandru Pufan

1,564
2
21
38

Using function that uses 'this' keyword not working as expected

3 Answers3