Core ui не работает для мобильных пользователей
Я использую script "ядро ui select" для стилизации своих форм на своем веб-сайте. Все отлично работало для пользователей настольных компьютеров, но с тех пор много сообщений от пользователей, использующих мобильные телефоны. Они говорят, что они не могут изменить параметр, потому что он greyed вне.
Итак, я сделал тест, используя плагин firefox под названием "Пользовательский агент по умолчанию", и я переключил свой агент браузера на iPhone. Тогда я понял, что вся форма перестала работать, но только для мобильных пользователей
Здесь тестовая страница, если вы хотите увидеть проблему вживую (вам нужно будет изменить свой агент пользователя, чтобы воспроизвести ошибку):
https://www.ni-dieu-ni-maitre.com/test_mobile.php
И вот код страницы.
<script type="text/javascript" src="https://www.no-gods-no-masters.com/scripts/jquery-1.8.2.min.js"></script>
<link href="#" onclick="location.href='https://www.no-gods-no-masters.com/scripts/css/core-ui-select.css'; return false;" media="screen" rel="stylesheet" type="text/css">
<link href="#" onclick="location.href='https://www.no-gods-no-masters.com/scripts/css/jquery.scrollpane.css'; return false;" media="screen" rel="stylesheet" type="text/css">
<script>
$(document).ready(function(){
$('#impression').coreUISelect();
});
</script>
</head><body>
<select class="b-core-ui-select__dropdown" name="impression" id="impression">
<option>Printing on front</option>
<option>Printing on back</option>
</select>
<script src="https://www.no-gods-no-masters.com/scripts/js/jquery.core-ui-select.js"></script>
</body>
</html>
Ответы
Ответ 1
Это не ошибка. При выполнении на мобильном устройстве плагин (core-ui-select) явно пропускает код манипуляции DOM, который предназначен для отображения выпадающего списка.
Чтобы увидеть это, вы можете установить точку останова в строке jquery.core-ui-select.js номер 176.
CoreUISelect.prototype.showDropdown = function() {
this.domSelect.focus();
this.settings.onOpen && this.settings.onOpen.apply(this, [this.domSelect, 'open']);
if($.browser.mobile) return this; //176: this skips the rest on mobile
if(!this.isSelectShow) {
this.isSelectShow = true;
this.select.addClass('open');
this.dropdown.addClass('show').removeClass('hide');
if(this.isJScrollPane) this.initJScrollPane();
this.scrollToCurrentDropdownItem(this.dropdownItem.eq(this.getCurrentIndexOfItem()));
this.updateDropdownPosition();
}
}
Оценка по строке 176: $.browser.mobile
оценивает значение true при нажатии (я имитировал мобильное устройство в Chrome), а остаточный код пропускается.
Исправить. Удаление строки показывает, что выпадающее меню просто отлично.