最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Uncaught TypeError: Cannot read property 'focus' of undefined - Stack Overflow

programmeradmin1浏览0评论

This issue is occurring when my page loads.

Using the following scripts -jquery.simplemodal-1.4.3.js -jquery v1.7.1

Below is a small code snap, of the code inside simplemodal where this error is occuring.

 focus: function (pos) {  
 var s = this, p = pos && $.inArray(pos, ['first', 'last']) !== -1 ? pos : 'first';
     // focus on dialog or the first visible/enabled input element
       var input = $(':input:enabled:visible:' + p, s.d.wrap);
       setTimeout(function () {
    input.length > 0 ? input.focus() : s.d.wrap.focus();
    }, 10);
  },

Any Ideas that i could do to resolve this would be great

This issue is occurring when my page loads.

Using the following scripts -jquery.simplemodal-1.4.3.js -jquery v1.7.1

Below is a small code snap, of the code inside simplemodal where this error is occuring.

 focus: function (pos) {  
 var s = this, p = pos && $.inArray(pos, ['first', 'last']) !== -1 ? pos : 'first';
     // focus on dialog or the first visible/enabled input element
       var input = $(':input:enabled:visible:' + p, s.d.wrap);
       setTimeout(function () {
    input.length > 0 ? input.focus() : s.d.wrap.focus();
    }, 10);
  },

Any Ideas that i could do to resolve this would be great

Share Improve this question edited Nov 21, 2017 at 12:52 gef 7,1414 gold badges44 silver badges49 bronze badges asked Apr 23, 2014 at 17:13 Bristol580Bristol580 1111 gold badge1 silver badge4 bronze badges 6
  • Open the developer tools, javascript debugger, and try to find exactly what variable in your code is undefined. – vortexwolf Commented Apr 23, 2014 at 18:29
  • its ing from the s.d.wrap.focus(); – Bristol580 Commented Apr 23, 2014 at 18:39
  • Probably you run your function before the document is loaded. MAybe it should be wrapped in $(function(){ ... }). Or after the modal is visible. – vortexwolf Commented Apr 23, 2014 at 19:38
  • hmmmmmm any other ideas ? – Bristol580 Commented Apr 24, 2014 at 20:36
  • You call your focus method when the modal is not visible. It's evident. Find a place where you call this method and try to call it after showing of that modal. – vortexwolf Commented Apr 24, 2014 at 21:22
 |  Show 1 more ment

1 Answer 1

Reset to default 2

This is an old question and the original poster has probably resolved his concrete issue.
But the general questions related to the Error Messages:

  • Uncaught TypeError: Cannot read property '...' of undefined
  • Uncaught TypeError: Cannot read property '...' of null
    and
  • Uncaught TypeError: Cannot set property '...' of undefined
  • Uncaught TypeError: Cannot set property '...' of null

are still important for many peoples and have a simple and general answer:

The object of that we try to read property, set property or call a function
- is not declared or
- is declared, but not defined or
- is null

Simple test code in Google Chrome

<script type="text/javascript">
// object obj is not declared, there is no previos 'var obj;'
obj.prop;              // Uncaught TypeError: Cannot read property 'prop' of undefined
obj.prop = "value1";   // Uncaught TypeError: Cannot set property 'prop' of undefined
obj.func();            // Uncaught TypeError: Cannot read property 'func' of undefined
// ------------------------------------------------------------------------
// object 'obj' is declared with:
var obj;
// but it is not defined, there is no value assigned to it (obj = 5 or something else)
obj.prop;              // Uncaught TypeError: Cannot read property 'prop' of undefined
obj.prop = "value1";   // Uncaught TypeError: Cannot set property 'prop' of undefined
obj.func();            // Uncaught TypeError: Cannot read property 'func' of undefined
// ------------------------------------------------------------------------
// object 'obj' is declared and defined. Value is null
var obj = null;
obj.prop;              // Uncaught TypeError: Cannot read property 'prop' of null
obj.prop = "value1";   // Uncaught TypeError: Cannot set property 'prop' of null
obj.func();            // Uncaught TypeError: Cannot read property 'func' of null
// ------------------------------------------------------------------------
// object 'obj' is declared and defined
var obj = {prop: "propertyValue", func: function() {return "returnValue"}}
// there are no errors
</script>

The same code in Firefox:

// object obj is not declared, there is no previos 'var obj;'
obj.prop;              // Uncaught TypeError: obj is undefined
obj.prop = "value1";   // Uncaught TypeError: obj is undefined
obj.func();            // Uncaught TypeError: obj is undefined
-----------------------------------
// object 'obj' is declared with:
var obj;
// but it is not defined, there is no value assigned to it (obj = 5 or something else)
obj.prop;              // Uncaught TypeError: obj is undefined
obj.prop = "value1";   // Uncaught TypeError: obj is undefined
obj.func();            // Uncaught TypeError: obj is undefined
-----------------------------------
// object 'obj' is declared and defined. Value is null
var obj = null;
obj.prop;              // Uncaught TypeError: obj is null
obj.prop = "value1";   // Uncaught TypeError: obj is null
obj.func();            // Uncaught TypeError: obj is null
-----------------------------------
// object 'obj' is declared and defined
var obj = {prop: "propertyValue", func: function() {return "returnValue"}}
// there are no errors

So there are some differences in the Error Message between browser, but the massage is clear:

The object in not defined or null.

In the general case it is easy to understand what exactly the error message means.

But why this happens in concrete cases?

The reasons could by many, but the important ones could be:

  • Calling a function or accessing a property

    • before it is initialized/defined
      These could happen, if an object (popup, modal), created on the fly, is not ready yet.
    • after it is destroyed
  • Structure changes by using new versions of an API, where a property or function was

    • renamed or
    • moved to other objects
  • By using loops on arrays: the index don't exist, because of

    • bad incrementation/decrementation or
    • bad condition

How to debug?

  • Find on which object and where the error is thrown
  • Read the documentation to assure that,
    • try using the object on the right place,
    • have called all needed functions, before using the object
  • Look in the scope/function if the object is defined,
  • If not, look in the stacktrace in its caller(s)...
发布评论

评论列表(0)

  1. 暂无评论