平面UI Radiocheck插件/单选按钮在iOS 8.4.1中不能切换（不再有效）。

Question

我正在使用最新版本的Flat UI Pro 1.3.2 (http://designmodo.com/flat/)，但在使用jQuery Plugin flatui-radiocheck v0.1.0时与iOS设备存在问题。

您可以在他们的演示页面中看到这个问题: http://designmodo.github.io/Flat-UI/

进入具有“单选按钮”标签的部分，并单击两个按钮“Radio is on”和“Radio is off”来切换单选按钮。在所有主要桌面浏览器（IE、FF、Safari (Windows)）中，这种切换(以视觉方式切换状态以及在DOM中切换单选元素的状态)都能正常工作。

然而，对于运行着最新iOS版本的iPhone 4s（8.4.1），Safari上存在问题：点击两个单选按钮不再切换它们的状态！

由于桌面浏览器都能正常工作，因此似乎与iOS上的移动Safari（可能是新版本）有关。

非常感谢您提供任何有关如何调试此错误的想法或帮助！

- Sebastian

Answer 1

我正在使用Flat UI Free（2.2.2），并发现了同样的问题。

我不确定为什么会出现这种情况，但已经通过略微调整radiocheck插件来解决它。

在flat-ui.js中，radiocheck插件定义的位置，我进行了以下更改：

// Adding 'nohover' class for mobile devices
var mobile = /mobile|tablet|phone|ip(ad|od)|android|silk|webos/i.test(global.navigator.userAgent);
if (mobile === true) {
   $this.parent().hover(function () {
      $this.addClass('nohover');
   }, function () {
      $this.removeClass('nohover');
   });
}

to:

// Adding 'nohover' class for mobile devices
if (/iPhone|iPod|iPad/i.test(global.navigator.userAgent)) { //fix for ios
   $this.addClass('nohover');
} else {
   var mobile = /mobile|tablet|phone|ip(ad|od)|android|silk|webos/i.test(global.navigator.userAgent);
   if (mobile === true) {
      $this.parent().hover(function () {
         $this.addClass('nohover');
      }, function () {
         $this.removeClass('nohover');
      });
   }    
}

我不使用复选框，所以我不知道它们是否会受到这个改变的影响。

- en2ie

---

谢谢你的提示！你测试过这个在“老旧”的iOS浏览器上吗？比如Safari 8.4版本？ - Sebastian

我在iPad上测试了8.4版本和iPhone上的8.4.1版本，但没有测试旧于这些版本的设备。 - en2ie