兼容性之IOS下label 无法点击
今天做移动端的页面时碰到一个稀奇的问题,那就是点击label无法选中与之相关的checkbox,下面是问题代码:
<li class="list-item clearfix notify-toggle">
<label class="setting-title">新消息通知</label> <div class="toggle-box">
<input id="btn_setting_toggle" type="checkbox"> <label class="toggle-ui" for="btn_setting_toggle"></label>
</div>
</li>
此时出现的问题是,在ios4下不论何种浏览器都会出现点击label无法选中checkbox的情况,其他系统或手机都能正常。
最终解决:最后在万能的stackoverflow下找到了答案:HTML <label> command doesn't work in Iphone browser,其实就是添加一个空的click事件。改好的代码:
<label class="toggle-ui" for="btn_setting_toggle" onclick=""></label>//添加空的click事件
最大的感慨还是:你现在踩到的坑其实许多前辈已经踩过,所以要走的还有很多!
兼容性之IOS下label 无法点击的更多相关文章
- IOS下的 click 点击失效
当委托给一个元素添加click事件时,如果事件是委托到 document 或 body 上,并且委托的元素是默认不可点击的(如 div, span 等),此时 click 事件会失效. demo: & ...
- ios下点击穿透focus获取问题
在ios下的浏览器中当点击当前页的一个按钮,用window.location.href进行跳转时,如果下一个页面里这点击按钮的位置是一个textarea或者text等那么他会触发focus事件,会出现 ...
- 网页在ios下点击无效的原因
之前在做一个项目的时候,发现元素在ios系统中点击无法触发效果,网上查了一下发现 ios下 如果不是button,input这类标签的话 ,如果有点击事件的话最好给加一个css样式cursor:p ...
- ios下,<input type="checkbox"> 点击时出现黑色块
ios下,<input type="checkbox"> 点击时出现黑色块如下图 解决方法:
- 移动端踩坑之旅-ios下fixed、软键盘相关问题总结
最近一个项目掉进了移动端的大坑,包括ios下fixed布局,h5唤起键盘等问题,作为一个B端程序员,弱项就是浏览器的兼容性和移动端的适配(毕竟我们可以要求使用chrome),还好这次让我学习了一下相关 ...
- iOS下WebRTC音视频通话(二)-局域网内音视频通话
这里是iOS 下WebRTC音视频通话开发的第二篇,在这一篇会利用一个局域网内音视频通话的例子介绍WebRTC中常用的API. 如果你下载并编译完成之后,会看到一个iOS 版的WebRTC Demo. ...
- 关于label的点击事件(原创)
通常做网页时不会用radio和checkbox的原有样式,通常会进行样式美化,手机端我用的jqurey weui框架,他的原理是这样的: <label class="check_lab ...
- 记一次事件委托在 ios 下的兼容 bug
项目中碰到的兼容类 bug,记录一二. 页面上有几个同类型的控件,点击它们会触发一些事件,很显然,事件委托优于批量绑定.为了图方便,我将 click 事件绑定到了 document.body 上(绑定 ...
- ios下fixed回复框bug的解决方案
前几天做一个移动端的页面,要加个像微信那样附着在底部的回复框,按照做PC端网页的思路,首先是用fixed,在安卓上测了一下是好的,结果到朋友的iphone6p上就不行了,点击输入框之后它总会跳到屏幕中 ...
随机推荐
- PHP 正则表达式处理字符串的应用(一)
现有一个字符串如下: '旅行专题,旅行好玩 美好旅行;旅行真棒,一起旅行[旅行远足' 里面的分隔符号不确定,需要置换为如下: '旅行专题,旅行好玩,美好旅行,旅行真棒,一起旅行,旅行远足' 可以使用P ...
- [LinqPad妙用]-在Net MVC中反射调用LinqPad中的Dump函数
LinqPad有个非常强大的Dump函数.这篇讲解一下如何将Dump函数应用在.Net MVC Web开发中. 先看效果: 一.用.Net Reflector反编译LinqPad.exe,找出Dump ...
- Swift—静态属性- 备
我先来设计一个类:有一个Account(银行账户)类,假设它有3个属性:amount(账户金额).interestRate(利率)和owner(账户名). 在这3个属性中,amount和owner会因 ...
- cf B. Dima and To-do List
http://codeforces.com/contest/366/problem/B 从0到k枚举起点,然后i+k判断是不是i+k>=n如果是i=(i+k)%n;否则i=i+k; #inclu ...
- ThrottleStop
ThrottleStop 我的要开这个软件,睿频才能开.不然一直工作在1.8Ghz下默认频率太低了开了这个速度才有提升
- android 无法生成R文件的原因剖析
android 无法生成R文件 是件痛苦的事情,即使有时候你xml文件没有错误,他都无法生成.针对此问题,我总结以下几个方面的原因. 一.xml本身有错误 R.java这个文件是会自动生成的,但是如果 ...
- About Adultism and why things ar the way they are
About - Adultism About Adultism and why things ar the way they are In this page we will try to clari ...
- Linux 内存管理知识学习总结
现在的服务器大部分都是运行在Linux上面的,所以,作为一个程序员有必要简单地了解一下系统是如何运行的.对于内存部分需要知道: 地址映射 内存管理的方式 缺页异常 先来看一些基本的知识,在进程看来,内 ...
- pyqt小例子 音乐盒
源代码1: # -*- coding: utf-8 -*- import sys,time,os import ctypes from PyQt4 import QtCore, QtGui,Qt fr ...
- Hive集成HBase详解
摘要 Hive提供了与HBase的集成,使得能够在HBase表上使用HQL语句进行查询 插入操作以及进行Join和Union等复杂查询 应用场景 1. 将ETL操作的数据存入HBase 2. HB ...