@andyj

Добрый день, подскажите плиииз.

Разрабатываю на компе сайт, который должен работать на мобилке.

А у мобилки... есть одна гадость которой нет у компа:

При установке ФОКУСА на любой инпут где предполагается ввод текста - выпрыгивает клавиатура!

...даже если она мне не нужна!!!

Например отладка компонента, где можно стрелками что-нибудь выбирать после того как фокус установишь кликом мышки. В мобилке сразу клавиатура показывается, хотя кроме стрелок там ничего не используется.

На какие события "выпрыгиывает клавиатура"??? и на каких компонентах?
Можно ли это заблокировать?

Хочу написать мини-фреймворк для отладки мобильных сайтов. Будет "маркер видимости клавиатуры" выпрыгиывать.
Но на какие события?

Сначала думал все input.onfocus переховатить, но ведь и "галочка" = это тоже интпут.
А может еще где? input-text, input-password, input-select, textarea...

...отладка сайта сразу на мобилке - не самый приятный процесс и без консоли не удобно.

0

@DimaDima1985

Отладку делайте на десктопе, включите режим мобильного браузера.

Либо не фокусируйтесь автоматически на инпуте, если определено, что смартфон, а не десктоп, например, по размеру экрана.

Добавлено через 1 минуту
ctrl+shift+m при открытой панели разработчика.

0

@andyj

Сайт - "монстр фроанкенштейна" = состоит из разных ЧУЖИХ(опенсорсных) компонент где не понятно что разрабы внутрь впихнули. А выявить "наличие инпута" получается лишь уже полностью поключив очередной компонент и привязав его к остальным. Потом когда все более менее работает, так и быть запускаю еще и на мобилке/планшете, а там только узнаю что компонент предстоит либо заменять, либо взламываь/переписывать. Хотелось бы подобное выяснять еще на ранних стадиях!



Но начать хочу именно с индикации/информирования пользователя/разработчика о том "если бы вы были на мобилке, то здесь бы уже клава выскочила"!

Есть хотябы полный СПИСОК типов "базовых" компонент на которых мобилка клаву открывает? (гугл пока не помог)

0

@evikza

andyj, здравствуйте. Современный атрибут inputmode может Вам помочь?

Вы можете заставить, выставив значение none полностью заблокировать вызов клавиатуры.

Поддержка на 22.08.21 мобильными браузерами очень даже хорошая.

Демонстрация

Добавлено через 48 минут
UPD: Хотя, мне кажется, я неправильно понял Вашу задачу.

3

@andyj

Спасибо за технологию (не знал что такое возможно - изучу), но вы действительно не правильно поняли.

Задача - не заблокировать в мобилке, добавив теги, а ВЫЯВИТЬ наличие "не заблокированных инпутов".

Тоесть получить в ДЕСКТОПЕ тот-же эффект, как и на мобилке - инпут получил фокус == сработал (мой) колбэк, сообщающий пользователя что "если бы ты был в мобилке, то уже наблюдал бы клавиатуру".

Задача - еще до тестирования на мобилке, протестировать не десктопе и выявить все "слабые для мобилки места".
Особенно касается "чужих" компонент, найденных на просторах и не понятно как работающих. Например сложный календарь может для возможности "управления клавишами" вставить скрытый инпут, в котором нет тега inputmode="none".

Учитывая что это для меня "критично" и "непонятно когда оно вылетет", могу на пол экрана надпись выдавать, музыку проигрывать или просто через alert() разработчиков придупредить. В 99% случаев в мобилке клава не нужна! (кроме случаем "введите что-нибудь текстом или цифрами" ) Но она очень полезна в десктопе...

Сейчас решил вопрос тем что на ВСЕ инпуты навесил addEventLis.. ('focus') и на потерю фокуса. Но понимаю что это "полумера", не учитывающая ни innerHtml = '<input>' ни doc.createElement('input'). И вообще не до конца понимаю в каких элементах можно ожидать клаву, а где она точно не выпрыгнет...

Нашел еще такое http://mobileinputtypes.com

0

@evikza

Еще раз здравствуйте. Вы можете подключить эмуляцию консоли — vConsole от Tencent или Eruda.

1

@andyj

(не знал о таких готовых решениях - пока не знаю зачем, но изучу спасибо)

А чем это поможет в моем случае???

Я написал компонент, который использует скрытый инпут для захвата клавиш и удержания фокуса. Насколько я знаю так многие делают. Мне нужны были только "стрелки" для навигации. В мобилке пришлось отключать функцию.

Теперь хочу проверить ("потыкав") мои проекты, в которых использую чужие компоненты, которые могли использовать скрытый инпут. Причем сделать это ДО того как проект попадет на мобилку!!! Тестировать на десктопе в разы проще...

Хочу ЭМУЛИРОВАТЬ поведение мобильного браузера на десктопе! Для начала нужно поймать дополнительным(моим) обработчиком "фокус" на ВСЕХ инпутах, включая "скрытые".

Сейчас это сделал тем что "перебором" навесил на все инпуты addEvListener('focus') через секунду после создания... Но это не всегда будет работать, если компоненты скрытых инпутов будут создаваться динамически и удаляться если не нужны!

0