移动设备safari不支持jquery的live绑定的解决办法

原创 2016年07月26日 15:37:31
   我在开发微信公众号的时候遇到的这个问题,在安卓里用live去绑定事件都没问题,用on也可以,但是到在iphone中的微信里确始终没法响应绑定的事件,后来网上找了些方法,有些可以,有些不行,这里给写下来,给正在坑里的码农们一些意见。

示例代码:

    <ul class="list">
        <li>1</li>
        <li>2</li>
        <li>3</li>
    </ul>

方法一:
首先要给绑定click事件的元素加上样式:cursor: pointer;

<style>
    .list li { cursor: pointer; }
</style>

然后再用live绑定事件

<script>
    $(function() {
        $('.list li').live('click', function() {
            alert('你点我了');
        })
    })
</script>

如果方法一对你无效,你也可以用方法二:

同样也给绑定click事件的元素加上样式:cursor: pointer;

然后用on来绑定事件,jquery1.7后推荐用on来动态绑定事件,因为比live更高效

<script>
    $(function() {
        $(document).on('click', '.list li', function() {
            alert('你点我了');
        });
    })
</script>

方法三:
直接用touchend事件,不用click事件
但是touchend事件会执行两次,绑定元素上执行一次,document上执行一次,这个需要用别的方法去屏蔽第二次响应,这里我不推荐使用,你也可以google一下,怎么去解决。

相关文章推荐

微信iOS端无法执行jquery on()方法

今天在做购物网站公众号时,首页上商品描述文字和图片点击都需要进入商品详情页,发现PC端和安卓端都可以正常跳转,iOS端点击图片可以正常跳转,点击文字则无任何反应。 jquery方法为: $(doc...
  • shuay
  • shuay
  • 2016年02月24日 18:54
  • 6127

兼容IE8以下浏览器input表单属性placeholder不能智能提示功能,以及使用jquery.validate.js表单验证插件的问题处理

http://www.w2bc.com/Article/60994

jQuery1.9+中删除了live以后的替代方法

根据jQuery的官方描述,live方法在1.7中已经不建议使用,在1.9中删除了这个方法。并建议在以后的代码中使用on方法来替代。   on方法可以接受三个参数:事件名、触发选择器、事件函数。 ...

jQuery,使用on代替delegate,live 写法区别

早期对页面上后期加载的动态元素,赋事件或值的时候,是使用live的.  由于效率比较低(其实数据不多也感觉不出来),后面使用delegate委托来代替了,再后面,1.7以后使用on 来代替delega...
  • itchiang
  • itchiang
  • 2014年03月20日 09:58
  • 12915

jquery live()调用不存在的解决方法

在新版的jquery中,live()方法已经被删除了,所以我们在调用的时候会提示该函数不存在,js报错。  解决方法是使用on()函数替换,  原来的写法是:    如果直接替换为on()方法,那...

Jquery的事件绑定live方法在ios版的微信网站无法正常工作

公司微信服务号网站,年前运行正常,年后突然出现ios手机页面点击没有任何反应,安卓手机一切正常。 刚过完年状态还在恢复中呢,突然冒出这种突发事件,搞得人焦头烂额,一阵乱点,突然页面有反应了,如获至宝...

关于jquery中on绑定click事件在苹果手机失效的问题

用一个div当做了一个按钮来使用。 下一步 因为是动态添加的内容,所以想要使用click事件,需要给他用on绑定一下:$(document).on("click",".ne...

学习笔记之MariaDB基础操作

MariaDB     mysql         --user  -u         --host  -h         --password   -p         --port   ...

带你跳出H5输入框input的坑

移动网页开发中input触发的手机键盘压榨页面布局的解决办法。

利用wireshark 通过mac os网络共享 抓取 移动设备上发起的 http 网络请求报文 (附:升级 10.10 以后 wireshark启动闪退解决办法)

首先说下 已经安装了  wireshark  升级 mac os 到 10.10 后 闪退的问题  本人 mac mini 很早之前就安装了 wireshark 抓包,最近升级 10.10 后 发现 ...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:移动设备safari不支持jquery的live绑定的解决办法
举报原因:
原因补充:

(最多只允许输入30个字)