javascript 未捕获的类型错误：无法读取未定义的属性“焦点”

Uncaught TypeError: Cannot read property 'focus' of undefined

提问by Bristol580

This issue is occurring when my page loads.

我的页面加载时会出现此问题。

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

使用以下脚本 -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.

下面是发生此错误的 simplemodal 内代码的一个小代码快照。

 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

我可以解决这个问题的任何想法都会很棒

回答by code_angel

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

• 未捕获的类型错误：无法读取未定义的属性“...”
• 未捕获的类型错误：无法读取 null 的属性“...”
  和
• 未捕获的类型错误：无法设置未定义的属性“...”
• 未捕获的类型错误：无法设置 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:

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

• 调用函数或访问属性

  • 在初始化/定义之前
    如果动态创建的对象（弹出窗口、模态）尚未准备好，则可能会发生这些情况。
  • 被摧毁后

• 通过使用新版本的 API 来更改结构，其中属性或函数是

  • 重命名或
  • 移动到其他对象

• 通过在数组上使用循环：索引不存在，因为

  • 错误的递增/递减或
  • 状况不佳

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)...

• 查找抛出错误的对象和位置
• 阅读文档以确保，
  • 尝试在正确的地方使用该对象，
  • 在使用对象之前调用了所有需要的函数
• 如果定义了对象，请查看作用域/函数，
• 如果没有，请查看其调用方中的堆栈跟踪...