执行脚本时未定义元素答案

【问题标题】：elements are not defined at the time the script is executed执行脚本时未定义元素
【发布时间】：2015-05-14 19:44:15
【问题描述】：

我正在尝试获取某些元素的数据属性，但是在创建对象时，尚未加载元素（我理解）。我的问题是什么是最好的（或任何）解决方案，因为我需要在两个不相互交互的独立函数中使用这个对象？

function Data_Num_Array(){
    this.data_num_array=$("*[data-num]");
}

Data_Num_Array.prototype.get_data_num_array_element=function(string_val){
    var data_num_of_element;
    for(var i=0;i<this.data_num_array.length;i++){
        if(this.data_num_array[i].id===string_val){
            data_num_of_element=$(this.data_num_array[i]).attr("data-num");
            break;
        }
    }
    return data_num_of_element;
};

function call_me(){
    console.log(obj.get_data_num_array_element("div"));
}

如果这里有语法错误，这不是问题，这只是针对问题的情况。

var obj=new Data_Num_Array();

$(document).ready(function(){
    console.log(obj.get_data_num_array_element("div"));
});

$("#click").click(function(){
    console.log(obj.get_data_num_array_element("click"));
});

<html>
    <head>
    </head>
    <body>
        <div id="div" data-num="1"></div>
        <button id="click" data-num="2"></button>
    </body>
</html>

【问题讨论】：

标签： javascript jquery object attributes prototype

【解决方案1】：

如果您是 JavaScript 新手，可能值得一读范围界定：MDN: Variable Scoping

简而言之，两个函数都需要obj，但我们可以利用范围来帮助我们确保$(document).ready 和$("#click") 都可以访问obj。另一方面，obj 需要等到文档准备好。我们可以暂缓使用您正在使用的 $(document).ready 回调函数实例化 Data_Num_Array。

稍微整理一下：

function Data_Num_Array(){
    this.data_num_array=$("*[data-num]");
}

Data_Num_Array.prototype.get_data_num_array_element=function(string_val){
    var data_num_of_element;
    for(var i=0;i<this.data_num_array.length;i++){
        if(this.data_num_array[i].id===string_val){
            data_num_of_element=$(this.data_num_array[i]).attr("data-num");
            break;
        }
    }
    return data_num_of_element;
};

$(document).ready(function(){
  var obj=new Data_Num_Array();

  console.log(obj.get_data_num_array_element("div"));

  $("#click").click(function(){
    console.log(obj.get_data_num_array_element("click"));
  });
});

现在，我们正在等待设置新的Data_Num_Array 和点击事件。

此外，您的点击处理程序中有一个小错误，您调用的是obj.get_data_num_array_element("button") 而不是obj.get_data_num_array_element("click")。（你给了你<button>一个“点击”的id。）

在比较固执的方面，考虑使用 camelCase 作为变量名。要输入的字符更少。 ;)

【讨论】：

需要 Data_Num_Array 对象的函数之一需要位于 $(document).ready 之外，因为它是从其他来源调用的，因此将函数放在 $(document).ready 内不会工作，因为它会在搜索该功能时导致错误。我想我没有在我的帖子中解释这一点。在你看来，我更喜欢 camelCase，但我的一个同事不喜欢它，所以我一直在尝试编写更多下划线的代码。
call_me 是返回值函数吗？如果是这样，您必须将其操作包装在 $(document).ready 中，并使用当 call_me 实际准备好返回时调用的回调函数。如果call_me 不是返回值函数，那么您仍然可以将它包装在$(document).ready 中。 $(document).ready 可以多次使用。这行得通吗？
call_me() 没有返回语句。我尝试将其包装在 $(document).ready 中，但随后调用该函数的行在控制台中返回该函数不存在