Почему не работает второй console.log?

Question

[Артур]

Почему первый console.log пересчитывает элементы, а второй выдает undefined?

function cutLongText() {
	var elem, size, text, show, allText, hide;
	elem = document.querySelectorAll('#text');
	show = document.getElementById('show');
	hide = document.getElementById('hide');
	for(var i = 0; i < elem.length; i++) {
		text = elem[i].innerHTML;
		allText = text;
		size = 730;
		if (text.length > size) {
			text = text.slice(0, size);
		}
		elem[i].innerHTML = text + '...';
		console.log(elem[i])
		show.onclick = function () {
			console.log(elem[i])
			/*elem[i].innerHTML = 'allText';
			show.style.display = 'none';
			hide.style.display = 'block';*/
		};
		hide.onclick = function () {
			elem[i].innerHTML = text + '...';
			show.style.display = 'block';
			hide.style.display = 'none';
		};
	};
};

Comments

[Сергей delphinpro]

Во-первых, onclick будет обработан в другом потоке.
Во-вторых, с каждой итерацией цикла вы перезаписываете значение в show.onclick

[Артур]

Сергей, можно по подробнее пожалуйста. Как мне использовать элемент elem[i] текущей итерации при онклике?

[Сергей delphinpro]

Артур Кудаев, не знаю. У вас show — один и тот же на все итерации. Как вы хотите повесить на него тонну онкликов?

[Артур]

Сергей, да, это я упустил.. одна кнопка на всех. Есть блок с текстом и кнопка которая показывает весь текст, и обрезает обратно. Или попробовать кнопки добавлять динамически? Можете что-то посоветовать?

[Артур]

iamevg_, Работает)) только с последним элементом.. почему так? я так понял за кнопки, что она одна на всех?

[gleendo]

Артур Кудаев, Объясните задачу, я вам напишу нормальное решение. Больно смотреть на ваш код если честно...его явно нужно переписать.

[gleendo]

Сергей, Когда это onclick стал работать в другом потоке? Либо я что то не понимаю, либо вы не правы.

[Артур]

iamevg_, я только с теории перехожу на практику.. с учетом того, что много с головы вылетело))
londonjack.ru/x/site1/index
В самом низу, кнопка которая должна показывать весь текст и обрезать обратно.

[gleendo]

Константин, а что же вы свой ответ то удалили не правильный?
К тому же это не вся задача. Посмотрите пример который скинул автор и увидите что по этому коду представлялось совсем другое.

[Сергей delphinpro]

iamevg_,

Либо я что то не понимаю, либо вы не правы.

я не прав, конечно.

[Артур]

Константин, спасибо) я на чекбоксах делал слайдер. Специально js использую для практики

[Артур]

Константин, аха)) ну что поделать, пока только такие решения в голову приходят хД))

[Артур]

Константин, хорошо, спасибо, буду пробовать)

Answer 1

[Сергей delphinpro]

https://jsfiddle.net/2dqbytaL/

Comments

[Артур]

Спасибо, буду пробовать разбираться с вашим кодом)