Core ui選擇不適用於移動用戶

我使用腳本「core ui select」在我的網站上設置我的表單樣式。對於桌面用戶來說，一切工作都很好，但是一段時間以來有很多用戶使用手機的報告。他們說他們無法修改選項，因爲它是灰色的。Core ui選擇不適用於移動用戶

所以我做了測試使用名爲「默認用戶代理」的Firefox插件，我將我的瀏覽器代理切換到iPhone。後來我意識到，整個窗體停止工作，但只針對移動用戶

這是一個測試頁面，如果你想看到的問題生活（你必須改變你的用戶代理重現bug）： 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="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>

來源

2015-05-21 libertaire

我剛剛意識到，即使是核心UI選擇腳本的演示頁面也有這個bug ...所以這不是我的網站的錯誤，但與核心UI選擇腳本...有人知道如何解決這個？我可以支付工作 – libertaire

UI核心並非真正爲移動設計。你可以試試這個：http：//touchpunch.furf.com/我添加了這個小腳本來使用uicore滑塊，並且在需要測試的所有移動設備上都能很好地工作，包括iPAD，iPhone，Samsung galaxy s3-4-5。希望有所幫助 – Bene

這不是一個錯誤。在移動設備上執行時，插件（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計算結果爲真（我模擬了移動設備在Chrome中），其餘代碼因此被跳過。

修復：刪除線顯示下拉就好。

來源

2015-05-25 22:45:08 BluePill

Core ui選擇不適用於移動用戶

回答

相關問題