我有以下适用于所有桌面浏览器的代码:
JQuery:
$('.select-one-style').on('click',function(){
$('.select-one-style').removeClass('active');
$(this).toggleClass('active');
var radioBtn = $(this).children('input[type=radio]');
radioBtn.prop('checked', true);
})
HTML:
<div class="choice-box select-one-style">
<img src="/static/shipment/images/style-wall-street.jpg" alt="Wall Street" />
<p>Wall Street</p>
<input type="radio" name="look-type" value="wall-street" />
</div>
<div class="choice-box select-one-style">
<img src="/static/shipment/images/style-classic.jpg" alt="Classic" />
<p>Classic</p>
<input type="radio" name="look-type" value="classic" />
</div>
<div class="choice-box select-one-style">
<img src="/static/shipment/images/style-hipster.jpg" alt="Hipster" />
<p>Hipster</p>
<input type="radio" name="look-type" value="hipster" />
</div>
<div class="choice-box select-one-style">
<img src="/static/shipment/images/style-preppy.jpg" alt="Preppy" />
<p>Preppy</p>
<input type="radio" name="look-type" value="preppy" />
</div>
但是,每次我在 iOS(尚未测试 android)上使用移动浏览器(Safari 和 Chrome)访问我的网站时,当我点击图像/输入时,单选按钮未被选中(尽管 CSS 效果会地方所以我知道触摸事件被注册为点击)。
有人知道为什么这段代码在移动设备上会出错吗?非常感谢您的帮助!
最佳答案
这可能是由于 ios 8 中的 300 毫秒延迟(点击延迟)造成的。 您可以尝试引入此元标记以避免这种延迟(从各种来源阅读)
<meta name="viewport" content="width=device-width, user-scalable=no">
我希望它至少适用于 ios 上的移动版 chrome 浏览器。试试看吧
关于javascript - 为什么这个 JQuery 代码在移动设备上会出错?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28914656/