Javascript 核心用户界面选择不适用于移动用户
我正在使用script core ui select在我的网站上设置表单样式。对于桌面用户来说，一切都很好，但从一段时间以来，有很多来自使用手机的用户的报告。他们说他们不能修改这个选项，因为它是灰色的 因此，我使用一个名为Default User Agent的firefox插件进行了测试，并将浏览器代理切换到iPhone。然后我意识到整个表单停止工作了，但只适用于移动用户 这是一个测试页面，如果您想实时查看问题，您必须更改您的用户代理以重现错误： 这是页面的代码Javascript 核心用户界面选择不适用于移动用户,javascript,php,jquery,forms,Javascript,Php,Jquery,Forms,我正在使用script core ui select在我的网站上设置表单样式。对于桌面用户来说，一切都很好，但从一段时间以来，有很多来自使用手机的用户的报告。他们说他们不能修改这个选项，因为它是灰色的 因此，我使用一个名为Default User Agent的firefox插件进行了测试，并将浏览器代理切换到iPhone。然后我意识到整个表单停止工作了，但只适用于移动用户 这是一个测试页面，如果您想实时查看问题，您必须更改您的用户代理以重现错误： 这是页面的代码 <script type
<script type="text/javascript" src="https://www.no-gods-no-masters.com/scripts/jquery-1.8.2.min.js"></script>
<link href="https://www.no-gods-no-masters.com/scripts/css/core-ui-select.css" media="screen" rel="stylesheet" type="text/css">
<link href="https://www.no-gods-no-masters.com/scripts/css/jquery.scrollpane.css" 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>
这不是一个错误。在移动设备上执行时，plugincoreiselect显式跳过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();
}
}
修正：删除该行可以很好地显示下拉列表。我刚刚意识到，即使是核心UI选择脚本的演示页面也有这个错误。。。所以这不是我的网站的bug，而是核心ui选择脚本。。。有人知道怎么解决这个问题吗？我可以支付workUI核心并非真正为移动设备设计的。你可以试试这个：我添加了这个小脚本来使用uicore滑块，并且在所有需要测试的移动设备上都能完美地工作，包括iPAD、iPhone、三星galaxy s3-4-5。希望有帮助