在做html5项目的时候有个需求是要拖动一个图片,但是又不要用户长时间按着弹出保存框。首先想到的就是在点图片的时候阻止默认事件的发生:

js停止冒泡·

function myfn(e){

window.event? window.event.cancelBubble = true : e.stopPropagation(); }

js阻止默认行为

function myfn(e){
window.event? window.event.returnValue = false : e.preventDefault();
}

防止冒泡

w3c的方法是e.stopPropagation(),IE则是使用e.cancelBubble = true·

stopPropagation也是事件对象(Event)的一个方法,作用是阻止目标元素的冒泡事件,但是会不阻止默认行为。什么是冒泡事件?如在一个按钮是绑定一个”click”事件,那么”click”事件会依次在它的父级元素中被触发 。stopPropagation就是阻止目标元素的事件冒泡到父级元素。

阻止默认行为

w3c的方法是e.preventDefault(),IE则是使用e.returnValue = false;·

preventDefault它是事件对象(Event)的一个方法,作用是取消一个目标元素的默认行为。既然是说默认行为,当然是元素必须有默认行为才能被取消,如果元素本身就没有默认行为,调用当然就无效了。什么元素有默认行为呢?如链接<a>,提交按钮<input type=”submit”>等。当Event 对象的 cancelable为false时,表示没有默认行为,这时即使有默认行为,调用preventDefault也是不会起作用的。

还有一个比较强悍的return false

javascript的return false只会阻止默认行为,而是用jquery的话则既阻止默认行为又防止对象冒泡。

话说回来在项目中无论使用哪种方法动达不到效果;没办法该页面结构,吧img外面套个div,在img上阻止默认事件,拖动div动从而实现拖动图片的目的。但是在阻止图片默认事件时还是阻止不了,查资料找到了  -webkit-touch-callout:none;即为禁用长按页面时的弹出菜单但是用在项目中一点用没有。于是接着找终于找到了pointer-events: none;点击穿透,这里有一篇博友写的介绍http://www.cnblogs.com/92cz/p/5787693.html  我就不再详细说了,最后没用js就把问题解决了太高兴啦,本项目还有另一种解法就是把图片弄成背景图,但是项目已经在测试了 只能用比较简单,保证效果的方法。

html 移动端关于长按图片弹出保存问题的更多相关文章

  1. 前端jquery实现点击图片弹出大图层(且滚动鼠标滑轮图片缩放)

    <img src="{$vo.photo}" height="50px" onclick="showdiv({$i});"> & ...

  2. 改善用户体验之wordpress添加图片弹出层效果 (插件 FancyBox)

    下面说说在改善用户体验之wordpress添加图片弹出层效果.效果图如下:   像这篇文章如何在百度搜索结果中显示网站站点logo? 文章内有添加图片,没加插件之前用户点击图片时,是直接_black打 ...

  3. jQuery效果之封装一个文章图片弹出放大效果

    首先先搭写一个基本的格式: $.fn.popImg = function() { //your code goes here } 然后用自调用匿名函数包裹你的代码,将系统变量以变量形式传递到插件内部, ...

  4. 基于jQuery图片弹出翻转特效代码

    分享一款基于jQuery图片弹出翻转特效代码.这是一款基于jQuery+HTML5实现的,里面包含六款不同效果的鼠标点击图片弹出特效下载.效果图如下: 在线预览   源码下载 实现的代码. html代 ...

  5. Android ListView 长按列表弹出菜单

    Android ListView 长按列表弹出菜单 设置长按菜单 listView.setOnCreateContextMenuListener(new View.OnCreateContextMen ...

  6. asp.net导出excel并弹出保存提示框

    asp.net导出excel并弹出保存提示框 2013-07-12 | 阅:1  转:78   |  分享  腾讯空间 人人网 开心网 新浪微博 腾讯微博 搜狐空间 推荐给朋友 举报          ...

  7. CEfSharp下载文件 弹出保存框,实现 IDownloadHandler 接口

    上节讲了如何将CefSharp集成到C#中,但集成后将web界面链接进ChromiumWebBrowser后,但web界面上下载附件的功能不好使咯. 百度了半天还是没搞定,只能去看官网的Excampl ...

  8. POI导出Excel不弹出保存提示_通过ajax异步请求(post)到后台通过POI导出Excel

    实现导出excel的思路是:前端通过ajax的post请求,到后台处理数据,然后把流文件响应到客户端,供客户端下载 文件下载方法如下: public static boolean downloadLo ...

  9. 使用CEfSharp之旅(3)下载文件 弹出保存框 IDownloadHandler

    原文:使用CEfSharp之旅(3)下载文件 弹出保存框 IDownloadHandler 版权声明:本文为博主原创文章,未经博主允许不得转载.可点击关注博主 ,不明白的进群191065815 我的群 ...

随机推荐

  1. 15. 3Sum[M]三数之和

    题目 Given an array nums of n integers, are three elements a, b, c in nums such that a+b+c=0? Find all ...

  2. 浅谈SpringCloud (一) 什么是微服务和不使用SpringCloud怎么访问服务提供者

    微服务和SpringCloud介绍 1.什么是微服务? 看过一遍介绍的很清楚的博客:https://blog.csdn.net/wuxiaobingandbob/article/details/786 ...

  3. 使用pgpool管理数据库集群故障的问题

    pgpool如何选举master角色 在pgpool启动的过程中通过对 pgpoo.conf配置文件中的数据库节点条目信息,对集群中的数据库节点从0开始一个个的遍历,并发送SQL语句“select p ...

  4. VB入门在线视频教程大全学习

    课程目录 9分钟47秒 课时1第一课:怎么编写程序 14分钟1秒 课时1第十七课第1节:文件读写的几种方式 14分钟14秒 课时2第二课:什么是变量和变量类型 19分钟24秒 课时3第三课:变量的声明 ...

  5. 如何巧妙使用ZBrush中的Image Plane插件

    ZBrush®插件Image Plane提供了一种简单的方法加载图像到ZBrush中,以在添加纹理过程中进行使用,比如使用ZProject笔刷多边形着色,以及利用参考图建模等. ZBrush 中文版下 ...

  6. ZBrush为电影制作设计独特的生物概念

    任何一个从事3D行业的艺术家,在雕刻和画画方面,都要有牢固的基本技能,还要会使用一些软件.比如今天我们提到的这位概念设计师.插画师和艺术导演Ian Joyner,他在创作新角色之前,都会思考如何以及为 ...

  7. 8、Situation-Dependent Combination of Long-Term and Session-Based Preferences in Group Recommendations: An Experimental Analysis ----组推荐中基于长期和会话偏好的情景依赖组合

    一.摘要: 背景:会话组推荐系统的一个主要挑战是如何适当地利用群组成员之间的交互引起用户偏好,这可能会偏离用户的长期偏好.长期偏好和群组诱导的偏好之间的相对重要性应该根据具体的群组设置而变化. 本文: ...

  8. 关于Vue实例的生命周期(2)

     关于Vue实例的生命周期(2) 创建(create)->挂载(mount)->更新(update)->销毁(destory) 钩子函数触发事件 beforeCreate 在实例初始 ...

  9. 调整mysql数据库最大连接数

    1.查看mariadb数据库最大连接数,默认为151 MariaDB [(none)]> show variables like 'max_connections'; +------------ ...

  10. 前端和后台对接时对sign加密方法

    前端和后台对接时对sign加密方法 /*后台php对接进行sign标签加密 1 获取向后台请求的数据data(key/value方式),可以是个对象(obj),也可以是数组(arr); 2 将数据的k ...