选项卡式复选框无法在移动设备上工作

我想创建一个TABBED复选框，除了移动电话外，一切正常。在手机上，点击其中一个标签后，它什么都不做，但是如果我调整方向，那么它会正确显示。谁能帮帮我吗。万一它很重要，我正在测试旧手机的兼容性，Android 4.4.2。选项卡式复选框无法在移动设备上工作

这里是代码codepen： http://codepen.io/lepew/pen/Ppqwez

<div id="sign_Page"> 
    <br/> 
    Please select "REGISTER" for new applicants, "LOGIN for current hello users and "FORGOT" if you need your password reset. 
    <br/> 
    <br/> 
    <div class="sign_Area"> 
     <input type="radio" name="tabGroup1" id="rad1" class="tab1"/> 
     <label for="rad1">REGISTER</label> 
     <input type="radio" name="tabGroup1" id="rad2" class="tab2" checked="checked"/> 
     <label for="rad2">LOGIN</label> 
     <input type="radio" name="tabGroup1" id="rad3" class="tab3"/> 
     <label for="rad3">FORGOT</label> 
     <div class="tab1"><!-- REGISTER --> 
      <div class="sign_Case"> 
       SIGNUP 
       <br/> 
       <br/> 
       SUMBIT 
      </div><!-- end of #sign_Case --> 
     </div><!-- end of TAB1 --> 
     <div class="tab2"><!-- LOGIN --> 
      <div class="sign_Case"> 
       LOGIN 
       <br/> 
       <br/> 
       SUMBIT 
      </div><!-- end of #sign_Case --> 
     </div><!-- end of TAB1 --> 
     <div class="tab3"><!-- FORGOT --> 
      <div class="sign_Case"> 
       EMAIL 
       <br/> 
       <br/> 
       SUMBIT 
      </div><!-- end of #sign_Case --> 
     </div><!-- end of TAB1 --> 
     <br/> 
     <br/> 
    </div><!-- end of #sign_Area --> 
</div><!-- end of #sign_Page -->

来源

2017-02-26 user3344341

我使用的笔记本电脑，触摸屏和它完美地工作这两个视口和任何窗口分辨率。 –

感谢您的回复，它适用于除手机之外的所有内容。我查了可以caniuse，一切都很好。 – user3344341

你使用哪个移动浏览器？ –

上的力移动的再流如由取向变化引起的。这些脚本，但你可能做到这一点...

someelement.style.display='none'; 
someelement.offsetHeight; // no need to store this anywhere, the reference is enough 
someelement.style.display='';

可选0 timeout触发回流就像查询offsetHeight作用：

sel.style.display = 'run-in'; 
setTimeout(function() { sel.style.display = 'block'; }, 0);

来源

2017-02-26 20:20:19

谢谢马克。 2个问题，是否真的值得用这种旧手机来定位？我该用什么替代someelement？ – user3344341

'element = document.getElementById（id）;'或者类似的东西，在你的页面上选择一个id，或者甚至专门为它设置一个id。你的目标不是技术而是商业/其他决定 - 这取决于。 –

选项卡式复选框无法在移动设备上工作

回答

相关问题