jQuery Uncaught TypeError Cannot read property fn of undefined anonymous function

Question

All  I m getting an error from some of my code that I downloaded  Here is the code     ----------------------------------------------------------------------      wl Alert v 1 1     description  Handles alert boxes    dependency  jquery UI Slider  fadeOutSlide plugin   ----------------------------------------------------------------------       fn wl Alert   function  method    var args   arguments  return this each function           var  this     this         if    fn wl Alert methods method             return   fn wl Alert methods method  apply this  Array prototype slice call args  1          else if  typeof method      object      method            if   this data  wl Alert                  var opts     extend      this data  wl Alert    method             else                var opts     extend       fn wl Alert defaults  method   this data                     else             error  Method      method      does not exist                if    this data  wl Alert                this data  wl Alert                   bind click events to hide alert box          this bind  click wl Alert   function  event                event preventDefault                   Don t hide if it is sticky             if    this data  wl Alert   sticky                      fn wl Alert methods close call  this 0                                 prevent hiding the box if an inline link is clicked            find  a   bind  click wl Alert   function  event                event stopPropagation                      else                show it if it is hidden     if   this is   hidden               this slideDown opts speed   2              if  opts    extend  this data  wl Alert    opts              fn wl Alert defaults     speed  500  sticky  false  onBeforeClose  function  element      onClose  function  element          fn wl Alert version    1 1       fn wl Alert methods     close  function          var  this     this           opts    this data  wl Alert          call callback and stop if it returns false     if  opts onBeforeClose call this   this      false            return false               fadeout and call an callback      this fadeOutSlide opts speed  function              opts onClose call  this 0    this              set  function          var  this     this           options           if  typeof arguments 0       object             options   arguments 0         else if  arguments 0   amp  amp  arguments 1      undefined            options arguments 0     arguments 1               each options  function  key  value            if    fn wl Alert defaults key      undefined      fn wl Alert defaults key     null                 this data  wl Alert   key    value            else                 error  Key      key      is not defined                               to create an alert box on the fly   wl Alert   function  text  cssclass  insert  after  options      go thru all    div alert   each function          var  this     this            and hide if one with the same text is allready set     if   this text      text             this slideUp   fn wl Alert defaults speed                create a new DOM element and inject it var al       lt div class  alert     cssclass      gt     text     lt  div gt    hide     after    al appendTo insert  wl Alert options    al prependTo insert  wl Alert options      return the element return al       Has anyone seen this type of error before  How would I resolve something like this  Thanks for any advice you have

User · Answer

try to call jQuery library before bootstrap js   lt script src  js jquery-3 3 1 min js  gt  lt  script gt   lt script src  js bootstrap min js  gt  lt  script gt

User · Answer

Try this    function                  put all that  wl alert  code here        jQuery       So  the   variable is apparently corrupted  but the jQuery variable should still refer to the jQuery object   In normal circumstances  both the   and jQuery variables refer to the  same  jQuery object    Instead of having to replace the   name with the jQuery name in your entire code  you can simply use an IIFE to alias the name manually  So  the outside-variable jQuery is aliased with the   variable inside the function   Here s a simple example to help you understand this concept   var foo    Peter     function   bar          bar    evaluates to  Peter      foo

User · Answer

I too had the  Uncaught TypeError  Cannot read property  fn  of undefined  with     fn circleType   function options     CODE          But fixed it by wrapping it in a document ready function   jQuery document  ready circleType   function options     CODE

User · Answer

I agree with MarsPeople regarding loading libraries in the wrong order  My example is from working with owl carousel   I got the same error when importing jquery after owl carousel    lt script src  owl carousel js  gt  lt  script gt   lt script src  jquery-3 1 1 min js  gt  lt  script gt    and fixed it by importing jquery before owl carousel    lt script src  jquery-3 1 1 min js  gt  lt  script gt   lt script src  owl carousel js  gt  lt  script gt

User · Answer

Import the jquery CDN as a first   e g    lt script   src  https   code jquery com jquery-3 3 1 min js    integrity  sha256-FgpCb KJQlLNfOu91ta32o NMZxltwRo8QtmkMRdAu8     crossorigin  anonymous  gt  lt  script gt

User · Answer

I had the same problem when using bootstrap-datewidget and i loaded jquery in the header instead of loading it at the end of the body and it worked

User · Answer

Ha ha ha Funny it s a simple mistake for me   I got async on my jquery library  call  Just remove it and I got solution    lt script async src  https   code jquery com jquery-3 3 1 min js  gt  lt  script gt    TO   lt script src  https   code jquery com jquery-3 3 1 min js  gt  lt  script gt    Why it did this kind of behave  I got  documentation on W3schools LINK  Definition and Usage async  The async attribute is a boolean attribute   When present  it specifies that the script will be executed asynchronously as soon as it is available   Note  The async attribute is only for external scripts  and should only be used if the src attribute is present    Note  There are several ways an external script can be executed   1  If async is present  The script is executed asynchronously with the rest of the page  the script will be executed while the page continues the parsing   2  If async is not present and defer is present  The script is executed when the page has finished parsing  3  If neither async or defer is present  The script is fetched and executed immediately  before the browser continues parsing the page

User · Answer

If you get Cannot read property  fn  of undefined  the problem may be you loading libraries in wrong order   For example   You should load bootstrap js first and then load bootstrap js libraries    lt script src  https   maxcdn bootstrapcdn com bootstrap 3 3 7 js bootstrap min js  gt  lt  script gt   lt script src  https   cdnjs cloudflare com ajax libs bootstrap3-dialog 1 34 7 js bootstrap-dialog min js  gt  lt  script gt

User · Answer

I had the same problem and I did it this way    note that I added jquery separately above this    lt  --ENJOY HINT PACKAGES --START -- gt   lt link href  path enjoyhint jquery enjoyhint css  rel  stylesheet  gt   lt script src  path enjoyhint jquery enjoyhint js  gt  lt  script gt   lt script src  path enjoyhint kinetic min js  gt  lt  script gt   lt script src  path enjoyhint enjoyhint js  gt  lt  script gt     lt  --ENJOY HINT PACKAGES --END -- gt    and it works

User · Answer

Hope it helps someone on earth  In my case jQuery and   were available but not when the plugin bootstrapped so I wrapped everything inside a setTimeout  Wrapping inside setTimeout helped me fix the error   setTimeout      gt            Your code goes here          function t  e           window

User · Answer

This error might also occur if you have require js  requirejs  implemented and you did not wrap some lib that you are using inside  define   jquery    function  jQuery            lib function          NOTE  you do not have to do this if this lib has AMD support  You can quickly check this by opening this lib and just ctrl f  amd

User · Answer

I fixed it by added the jquery slim min js after   the jquery min js  as the Solution Sequence    Problem Sequence   lt script src    vendor jquery jquery min js  gt  lt  script gt   lt script src    vendor bootstrap js bootstrap bundle min js  gt  lt  script gt    Solution Sequence   lt script src    vendor jquery jquery min js  gt  lt  script gt   lt script src    vendor jquery jquery slim min js  gt  lt  script gt   lt script src    vendor jquery-easing jquery easing min js  gt  lt  script gt

User · Answer

You can use noConflict function   var JJ  jQuery noConflict     JJ   back   click function         window history back           Change all   to JJ

User · Answer

When I used Electron   Angular such order helped me to solve problem     lt script src    assets js jquery-3 3 1 min js  gt  lt  script gt     lt script src    assets js jquery-3 3 1 slim min js  gt  lt  script gt     lt script src    assets js popper min js  gt  lt  script gt     lt script src    assets js bootstrap min js  gt  lt  script gt

[jquery] jQuery Uncaught TypeError: Cannot read property 'fn' of undefined (anonymous function)

Examples related to jquery