Для выполнения задания пришлось создать массив букв. Думаю, что это не верно. Не смог понять из курса, как вытащить текстовое содержимое у кнопки, а не data. Вот, хочу выяснить как) На названия не обращайте внимания, писал быстро не запаривался. Вот мой код
Сводка
`let submitButtons = document.querySelectorAll(’.key’);
let Display = document.querySelector(’.display’);
let Clear = document.querySelector(’.clear’);
let klava = [‘й’,‘ц’,‘у’,‘к’,‘е’,‘н’,‘г’,‘ш’,‘щ’,‘з’,‘х’,‘ъ’,‘ф’,‘ы’,‘в’,‘а’,‘п’,‘р’,‘о’,‘л’,‘д’,‘ж’,‘э’,‘ё’,‘я’,‘ч’,‘с’,‘м’,‘и’,‘т’,‘ь’,‘б’,‘ю’,’ '];
for (let i of submitButtons) {
i.onclick = function () {
Display.textContent += klava[i.dataset.index];
}
};
Clear.onclick = function () {
Display.textContent = ‘’;
};`
О, сделал один в один так же. только вместо display.textContent + key.textContent делал через +=. И да, как и топикстартер, сидел и думал, как же применить dataset.index… Оказалось проще.
Один вариант изящный, другой находчивый Но как все-таки должно выглядеть решение этого испытания, основываясь именно на той учебной программе из трёх глав “Знакомство с JavaScript”, которая была дана? Поправьте, если ошибаюсь, но о возможностях подобных решений (как в примерах выше) в обучении нам Кекс не рассказывал.
Хочу сделать более универсально, но не получается. Подскажите почему при нажатии на кнопку “Очистить” она печатается вместо того чтобы очищать дисплей?
let buttons = document.querySelectorAll(’.button’);
let display = document.querySelector(’.display’);
for (let key of buttons) {
key.onclick = function () {
if ( key == 0 ) {
display.textContent = '';
} else {
display.textContent += key.textContent;
}
}
};
У меня как-то так получилось
let buttons = document.querySelectorAll(’.button’);
let display = document.querySelector(’.display’);
for ( let button of buttons) {
button.onclick = function () {
if (button.classList.contains(‘key’)) {
display.append(button.textContent);
}
else {
display.textContent =’ ';
}
};
};
Долго ломал голову как сделать код. В итоге он добавляет буквы на дисплей, при этом нажатая буква пропадает с клавиатуры. Не могу понять из-за чего с клавы пропадают буквы.
let letters = document.querySelectorAll(’.key’);
let disp = document.querySelector(’.display’);
let text = document.createElement(‘p’);
let clear = document.querySelector(’.clear’);
text.textContent = ‘’;
for (let letter of letters) {
letter.onclick = function () {
text.append(letter);
disp.textContent = text.textContent;
}
};
clear.onclick = function () {
disp.textContent = ‘’;
}
Посмотрев, здесь ответы, понял что в моем много лишнего. При нажатии на букву , на дисплей выводит, но почему она пропадает из виртуальной клавиатуры никак не пойму…
let keyboardButtons = document.querySelectorAll('.key');
let display = document.querySelector('.display');
let clear = document.querySelector('.clear');
for (let keyboardButton of keyboardButtons) {
keyboardButton.onclick = function () {
let newString = keyboardButton.textContent
display.append(newString);
};
}
clear.onclick = function () {
display.textContent = '';
};
У Вас код в первую ветку не заходит никогда, так как условие странное. Получается key это выделенный элемент в данном случае кнопка Очистить, и это значение никогда 0 равно не будет.
И получается идёт во 2-ую ветку и берется textContent от кнопки.
С таким условием всё работает, но тут можно ещё подумать над более изящным условием.
let buttons = document.querySelectorAll('.button');
let display = document.querySelector('.display');
for (let key of buttons) {
key.onclick = function () {
if ( key.textContent == 'Очистить' ) {
display.textContent = '';
} else {
display.textContent += key.textContent;
}
}
};
Upd: вот решение получше как по мне if (key.classList.contains('clear'))
Значит написала всё. Смотрю - не работает, хотя вроде всё правильно (даже на листе расписала последовательность). Не могла понять, что не так.
Зашла на форум. Подумала “Может это я неправильно думаю”.
Нахожу этот вариант. 1 в 1 просто.
У меня еще больше вопросов стало возникать, как так?
Потом уже просто начала сравнивать посимвольно… И… Ошибка была в том, что неправильно написала слово (onklick <- это неправильный вариант).
Одна буква, потратила мне нервы (чуть-чуть) и время.
Так что совет на будущее, проверяйте правильность слов, расставления скобок и прочее
let keys = document.querySelectorAll('.key');
let display = document.querySelector('.display');
let button = document.querySelector('.button');
function one (i){
let test = display.textContent = keys[i].textContent;
keys[i].onclick = function(){
display.append(test);
}
}
for (i = 0; i < 34; i++){
one(i);
}
button.onclick = function(){
display.textContent = '';
}
Сидел я значит ломал голову, и никак не мог додуматься что внутри функции обработчика код:
display.textContent += key.textContent;, не тоже самое что и display.textContent + key.textContent;
Так как функция сначала берет дисплей. Кстати, у всех при нажатии на кнопку она сжимается? Как это пофиксить? Пробовал через key.disabled = true; - не выходит.
Но как все-таки должно выглядеть решение этого испытания, основываясь именно на той учебной программе из трёх глав “Знакомство с JavaScript”, которая была дана? Поправьте, если ошибаюсь, но о возможностях подобных решений (как в примерах выше) в обучении нам Кекс не рассказывал.
