兼容性之IOS下label 无法点击

今天做移动端的页面时碰到一个稀奇的问题,那就是点击label无法选中与之相关的checkbox,下面是问题代码: <li class="list-item clearfix notify-toggle"> <label class="setting-title">新消息通知</label> <div class="toggle-box"> <input id="btn_setting…

IOS下的 click 点击失效

当委托给一个元素添加click事件时,如果事件是委托到 document 或 body 上,并且委托的元素是默认不可点击的(如 div, span 等),此时 click 事件会失效. demo: <!DOCTYPE html> <html lang="en"> <head> <title></title> <meta charset="UTF-8"> <meta http-equiv=&…

ios下点击穿透focus获取问题

在ios下的浏览器中当点击当前页的一个按钮,用window.location.href进行跳转时,如果下一个页面里这点击按钮的位置是一个textarea或者text等那么他会触发focus事件,会出现ios自带的输入框要防止这个问题的出现需要站在点击前一页时使用preventDefault()阻止默认时间就可以解决了!…

网页在ios下点击无效的原因

之前在做一个项目的时候,发现元素在ios系统中点击无法触发效果,网上查了一下发现 ios下如果不是button,input这类标签的话 ,如果有点击事件的话最好给加一个css样式cursor:pointer;之后居然神奇的就可以了相信对你一定有用!…

ios下，<input type="checkbox"> 点击时出现黑色块

ios下,<input type="checkbox"> 点击时出现黑色块如下图解决方法:…

最近一个项目掉进了移动端的大坑,包括ios下fixed布局,h5唤起键盘等问题,作为一个B端程序员,弱项就是浏览器的兼容性和移动端的适配(毕竟我们可以要求使用chrome),还好这次让我学习了一下相关知识.让我们一起来看一下我怎么挣扎出这个大坑的. 一.背景先看一下要做什么,也就是一个文章评论的版块,下面依次有输入框,点赞,收藏等 .大概长下面这个样子: 要求也很常规,吸底,输入评论提交.那么上来就输代码吧. 二.ios下fixed布局关于这种吸底操作,上来就直接选用fixed了,这种场景舍…

iOS下WebRTC音视频通话（二）-局域网内音视频通话

这里是iOS 下WebRTC音视频通话开发的第二篇,在这一篇会利用一个局域网内音视频通话的例子介绍WebRTC中常用的API. 如果你下载并编译完成之后,会看到一个iOS 版的WebRTC Demo.但是那个demo涉及到外网的通讯需要FQ,而且还有对信令消息的封装理解起来非常的困难. 但是,我将要写的这个demo去掉了STUN服务器.TURN服务器配置,以及信令的包装,基本上是用WebRTC进行音视频通话的最精简主干了,非常容易理解. 准备因为这个Demo用到了我之前写的另外两个工程: 一个…

关于label的点击事件(原创)

通常做网页时不会用radio和checkbox的原有样式,通常会进行样式美化,手机端我用的jqurey weui框架,他的原理是这样的: <label class="check_label" for="sort_4"> <input type="radio" class="weui_check" name="sort" id="sort_4"> <i cla…

记一次事件委托在 ios 下的兼容 bug

项目中碰到的兼容类 bug,记录一二. 页面上有几个同类型的控件,点击它们会触发一些事件,很显然,事件委托优于批量绑定.为了图方便,我将 click 事件绑定到了 document.body 上(绑定在 document 上也是一样),在安卓机上反应良好,ios 上居然不会触发点击事件! 试着将事件绑定到了控件的父级元素,问题消失了. 事实上,当使用事件委托给一个元素添加 click 事件时,如果事件是委托到 document 或 body 上,并且委托的元素是默认不可点击的(如 div, sp…

ios下fixed回复框bug的解决方案

前几天做一个移动端的页面,要加个像微信那样附着在底部的回复框,按照做PC端网页的思路,首先是用fixed,在安卓上测了一下是好的,结果到朋友的iphone6p上就不行了,点击输入框之后它总会跳到屏幕中间去. 后来才知道这是ios下一个普遍的bug,所以我决定把原因和解决方案整理一下,以方便后人. 网上有的人说用那个iscroll.js来解决,不过那样会出现很多样式上的冲突,而且为了一个fixed的bug就动用一个js,未免有点大材小用了. 原因 ios下面,软键盘唤起后,页面的 fixed 元素…