Why does jQuery mask say it's not a function?

Question

When trying to use the jQuery mask() function, I get the following error in the console:

TypeError: $(...).mask is not a function

This is a sample of my code where this is happening:

<html>
<body>
<input type='text' id='phone' />
</body>

<script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>

<script>
//alert($);
$(document).ready(function(){

        $("#phone").mask("(99) 9999-9999");
});
</script>

</html>

How do I fix this?

make sure that you have included the plugin script on your page — darshanags, Feb 14 '15 at 05:59

Gnucki · Accepted Answer · 2017-03-02T10:07:10.217

34

Jquery mask is a plugin. You can directly add this line in your HTML if you want to use a CDN version:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.10/jquery.mask.js"></script>

Another way is to use a package manager like npm or bower. To accomplish that, follow the instructions in the README.md file of the project.

edited Mar 02 '17 at 10:07

answered Feb 14 '15 at 06:06

Gnucki

5,043
2
29
44

Thanks. I throught this was built-in in the jquery. – Jack Feb 14 '15 at 06:17
2

You should not use the link to a JavaScript in a gihub format. You should use its minimized version publicly available or store it in a local file. – Sigismundus Feb 14 '15 at 06:23
If I use mask "(99) 9999?9-9999" and type `123456789` I get the literally the `?` symbol: `(12) 3456?7-89`. How fix it? – Jack Feb 14 '15 at 06:23
@Sigismundus: It was for testing only. Since it worked, I download it to a local file. – Jack Feb 14 '15 at 06:24
OK - if you do not need ? character then you can remove it. – Sigismundus Feb 14 '15 at 06:25
Yes you have to do the minifying process on your own server here. I'm sorry but I never used this plugin so I just can give you the link to some documentation: http://igorescobar.github.io/jQuery-Mask-Plugin/ – Gnucki Feb 14 '15 at 06:26
@Sigismundus: I suposed it's for make the number optional. – Jack Feb 14 '15 at 06:27
It seems you must use `#` instead of `?`. – Gnucki Feb 14 '15 at 06:28
You could use [patterns](http://igorescobar.github.io/jQuery-Mask-Plugin/) i.e. for numbers {pattern: /[0-9*]/} – Sigismundus Feb 14 '15 at 06:29

score 21 · Answer 2 · answered Jul 07 '17 at 18:37

21

Change this line from

$(document).ready(function(){

to

$(document).ready(function($){

answered Jul 07 '17 at 18:37

RAHUL KRISHNA

219
2
2

2

You absolutely do need the plug-in on the page, but if that still doesn't help you - do this! – regan_leah Apr 11 '18 at 13:56
2

:o that was it! What's the explanation? I already had the plugin on the page – Jhonatan Pereira Dec 06 '18 at 16:57
2

Man, i already had the pkugin on page, but it wasn't working. This solved the problem. What is the explanation of this? – Valentoni Mar 26 '19 at 01:39
yeah.. what's the explanation? – Hernan Velasquez Feb 13 '20 at 01:35

score 2 · Answer 3 · answered Feb 14 '15 at 06:07

2

jQuery itself does not provide functionality for masking an input. You can use one of the plugins avaiable for it.

answered Feb 14 '15 at 06:07

Sigismundus

635
4
15

Why does jQuery mask say it's not a function?

3 Answers3

Linked