Всем привет. Помогите разобраться, по всей видимости, с контекстом вызова. Проблема заключается в том, что при вызове методов text() и attr() я получаю - is not a function. Есть вот такой скрипт, в котором элементы динамически добавляются на страницу из массивов. Если вдруг это покажется вам белибердой - это потому, что я удалил всё, что мог, чтобы лишний код вас не отвлекал.
В общем, есть два массива и элементы добавляются на страницу из этих массивов (не знаю, имеет ли это значение, поэтому напишу -на всякий ). В какой-то момент мне нужно сравнить оба элемента, чтобы что-то с ними сделать. У одного я сравниваю динамически сформированный атрибут data, у другого text(). Мне нужно получить выбранный элемент $(this), через click, и этот выбранный элемент я помещаю в переменную, чтобы потом я мог их сравнить. Я создаю пустой объект в глобальной видимости, а после, при клике на элементы, помещаю каждый выбранный $(this) в переменную.
Уверен, что проблема в контексте $(this) и ссылке на него. Видимо, когда я сравниваю - контекст теряется. Имею смутное представление о bind, apply и call, не не понимаю, как в моём случае решить проблему.
HTML :
<section></section>
jQuery :
var section = $('section');
// Те самые переменные, в которые я помещаю $(this)
var checkedImg = {};
var checkedWord = {};
// Два массива. В каждом лишь по элементу, чтобы легче было воспринимать код
var words = ['Lemon'];
var images = [
{
src: 'https://i.pinimg.com/originals/01/26/a0/0126a0e2f6e6c065d5befa53f3694652.png',
data: 'Lemon'
}
];
$.each(images, function() {
var img = '<img class="add-img" src="'+ this.src +'" data="'+ this.data +'">';
section.append(img);
});
$.each(words, function(index, value) {
var word = '<p class="add-words">'+ value +'</p>';
section.append(word);
});
section.on('click', 'img', function() {
checkedImg = $(this); // В переменную я помещаю текущий выбранный элемент. Их много
checkResult();
});
section.on('click', 'p', function() {
checkedWord = $(this); // В переменную я помещаю текущий выбранный элемент. Их много
checkResult();
});
function checkResult() {
var img = checkedImg.attr('data');
var text = checkedWord.text();
if (img == text) {
checkedImg.add(checkedWord).hide();
}
}
филд
checkedImg.attr('data') - не функция
checkedWord.text() - не функция
Если вы спросите, а почему не помещать в переменную сразу $(this).text() - потому что .text() и attr() я сравниваю, а работаю с этими элементами. Они в любом случае нужны. Хотя я пробовал отдельно помещать $(this) в одну переменную, а её атрибуты в другую - не помогло.
Помогите передать $(this) в переменные, чтобы с ними (зысами) можно было работать.
Спасибо