@archt3c
Очень нравится JS.

Как убрать глюк input?

Добрый вечер, помогите понять почему происходит следующий глюк.
При клике в нужный button с указанием наличной оплаты, input создается но ввести в него что то я могу лишь когда зажата мышь.
Ссылка на jsfiddle.
  • Вопрос задан
  • 116 просмотров
Решения вопроса 2
@smigles
Input нужно создавать не внутри button.
Ответ написан
Комментировать
@FabiBoom
Во первых, как сказал smigles, интерактивное содержимое нельзя вставлять друг в друга (ссылку в кнопку, текстовое поле в ссылку, ибо не понятно, что делать когда пользователь будет пытаться взаимодействовать с таким содержимым).
Во вторых, у вас обработчик клика на кнопку изменяет innerHTML кнопки добавляя внутрь кнопки текстовое поле. И вот вы кликаете по текстовому полю (срабатывает событие на клика на input, а потом происходит всплытие события click (гуглите, если не знаете).
Вот:
input_holder.addEventListener('click',(event)=>{
   input_holder.innerHTML = `<input type="text" id="inp_m">`;
});

Родительским элементом текстового поля является кнопка, а значит и на ней запускается опять тот же обработчик клика, что и раньше и опять же меняет содержимое внутри кнопки, добавляя туда текстовое поле предварительно удалив предыдущее и конечно же тогда фокус с текстового поля пропадет (ибо, повторюсь, это текстовое поле удалили и заменили на новое). Тут в вашем случае или условием проверять, или отменять всплытие события, или удалять обработчик после срабатывания.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы