2

I have a problem with an html page

here a simplified version of the page

<html>
    <head>
        <script type="text/javascript">

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

        </script>
    </head>
    <body>
        <input type"text" onblur="maxLength()">
    </body>
</html>

on onblur event I receive this error

Uncaught TypeError: maxLength is not a function

but if i call the function from console it works without errors and print 'maxLength'

Why?

andrean
  • 107
  • 12
  • 1
    The code you posted works fine. Instead of the "simplified" version, perhaps you can post something closer to the *actual* version. – Pointy Oct 30 '18 at 18:28
  • 1
    My guess is that there's a global variable, property, or function called maxLength. Try a different name for your function. – j08691 Oct 30 '18 at 18:28
  • See [here](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement) in particular the `maxLength` property – Matt Burland Oct 30 '18 at 18:35

2 Answers2

4

The code there runs in the context of the input, which has defined maxLength.

Better developer tools would make it clearer:

maxLength is not a function at HTMLInputElement.onblur

Rename your function to something else or use a different way of attaching the event listener.

alex
  • 479,566
  • 201
  • 878
  • 984
0

If you rename the function to something else it should work fine for you. The explanation is aptly given with Alex already. Example:

<html>
    <head>
        <script type="text/javascript">

            function maximumLength()
            {
                console.log('maxLength');
            }

        </script>
    </head>
    <body>
        <input type"text" onblur="maximumLength()">
    </body>
</html>
adityap
  • 329
  • 1
  • 10
  • 2
    It's not a *keyword*, it's a property of `HTMLInputElement` which is being looked up because `onEvent` type attributes are weird for historical reasons and backwards compatibility. – alex Oct 30 '18 at 18:34