2015-05-14 3 views
0

Я пытаюсь получить атрибут данных некоторых элементов, однако, когда объект создан, элементы еще не загружены (что я понимаю). Мой вопрос - это то, что было бы лучшим (или любым) решением для этого, поскольку мне нужно использовать этот объект в двух отдельных функциях, которые не взаимодействуют друг с другом?элементы не определены во время выполнения сценария

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> 

ответ

0

Если вы новичок в JavaScript, это может быть стоит прочитать на обзорном: MDN: Variable Scoping

Короче говоря, obj требуются по две функции, но мы можем использовать область видимости, чтобы помочь нам гарантировать, что и $(document).ready и $("#click") будут иметь доступ к obj. obj, с другой стороны, должен ждать, пока документ будет готов. Мы можем удержаться при создании Data_Num_Array с помощью функции обратного вызова $(document).ready, которую вы используете.

С немного переставляя:

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> идентификатор «click».)

На более упрямой стороне подумайте об использовании camelCase для имен переменных. Меньше символов для ввода. ;)

+0

Одной из функций, которые нуждаются в объекте Data_Num_Array, должно быть вне $ (document) .ready, поскольку оно вызывается из других источников, поэтому размещение функции внутри $ (document) .ready не будет работать так, как это 'd вызывает ошибку при поиске этой функции. Полагаю, я не объяснил это в своем посте. По вашему мнению, я предпочитаю camelCase, но коллеге мне это не понравилось, поэтому я пытался писать код с более подчеркиванием. – Cody

+0

Является ли функция 'call_me' функцией возвращаемого значения? Если это так, вам придется обернуть свои действия в '$ (document) .ready' и использовать функцию обратного вызова, которая вызывается, когда' call_me' действительно готов к возврату. Если 'call_me' не является функцией возвращаемого значения, вы можете поместить ее в' $ (document) .ready'. '$ (document) .ready' может использоваться несколько раз. Это работает? –

+0

call_me() не имеет оператора возврата. Я попробовал обернуть его в $ (document) .ready, но затем строку, которая вызывает функцию, возвращаемую в консоли, что функция не существует – Cody

Смежные вопросы