火狐html5拖拽 弹出新页面解决办法
今天做项目时,需要实现一个拖拽排序的功能,遂想到了html5的拖拽,便开始查资料,写代码。功夫不复有心人,通过网上资料作参考,排序功能成功实现。谷歌浏览器测试,拖拽平滑,无问题。火狐浏览器测试时,却无法拖拽,只能触发dragstart事件,其它事件却无法触发,这让我很摸不到头脑。查了查资料,并没有找到问题所在。后来经过自己不断的测试,发现火狐浏览器中,dragstart事件触发时,必须设置拖拽数据。
火狐浏览器中,可以正常拖拽了,但一切到这里并有完。火狐中拖拽,每次dragend的时候,都会弹出一个新页面。其实,这个问题本身并没有太大影响,但是每次拖拽结束,总弹出一个新页面,总感觉不是特别好。网上搜了下资料,了解到,通过给body绑定drop事件,并阻止冒牌和默认事件,便可以解决此问题。代码截图如下:
注:stopPropagation() 和 preventDefault()两个方法必须都写,单写一个是解决不了问题的。
火狐html5拖拽 弹出新页面解决办法的更多相关文章
- Asp.net页面使用showModalDialog时Postback弹出新页面解决办法
今天碰到一个让我一开始觉得莫名其妙的问题, 用window.showModalDialog打开一个.aspx文件,然后点击这个页面上一个button, 把页面的数据存入数据库之后,居然又打开一个这个页 ...
- html5 拖拽文件到页面实现上传
思路:监听拖拽区域的 drop 事件,阻止浏览器上的默认拖拽事件 参考:http://www.helloweba.com/view-blog-192.html 例子: <!DOCTYPE htm ...
- Html5拖拽复制
拖拽是一种常见的特性,即抓取对象以后拖到另一个位置. 在 HTML5 中,拖拽是标准的一部分,任何元素都能够拖拽. Html5拖拽非常常见的一个功能,但是大部分拖拽的案例都是一个剪切的过程, 项目中需 ...
- HTML5拖拽功能中 dataTransfer对象详解
有了HTML5,老板再也不用担心我们的上传了,再加上有拖拽上传是不是很酷.百度一下,有关HTML5拖拽上传的文章和实例不少,都缺不了一个至关重要的东东DataTransfer.但是详细介绍的不多,尤其 ...
- html5拖拽
html5拖拽一 <!DOCTYPE html> <html> <head lang="en"> <meta charset=" ...
- HTML5 拖拽复制功能的实现方法
Internet Explorer 9FirefoxOpera 12ChromeSafari 5 v1.0代码部分 <!DOCTYPE html><html><head& ...
- 每天一个JavaScript实例-html5拖拽
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- javascript 关于弹出新页面始终在正中央方法
记录一个关于弹出新页面始终在正中央方法 function openwindow(url, name, iWidth, iHeight) { var url; ...
- html5(拖拽3)
<!DOCTYPE html"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> ...
随机推荐
- OpenCV学习笔记:resize函数改变图像的大小
OpenCV提供了resize函数来改变图像的大小,函数原型如下: , , int interpolation=INTER_LINEAR ); 参数解释: src:输入,原图像,即待改变大小的图像: ...
- 进程管理之fork函数
fork函数的定义 #include <unistd.h> #include <sys/types.h> pid_t fork(void); fork函数在父进程中返回子进程的 ...
- Clang之语法抽象语法树AST
语法分析器的任务是确定某个单词流是否能够与源语言的语法适配,即设定一个称之为上下文无关语言(context-free language)的语言集合,语法分析器建立一颗与(词法分析出的)输入单词流对应的 ...
- SLF4J源码解析-LoggerFactory(一)
slf4j的含义为Simple logging facade for Java,其为简单的为java实现的日志打印工具,本文则对其源码进行简单的分析 JAVA调用SLF4J public class ...
- python web入门程序
python2.x web入门程序 #!/usr/bin/python # -*- coding: UTF-8 -*- # 只在python2.x 有效 import os #Python的标准库中的 ...
- Python初学——多进程Multiprocessing
1.1 什么是 Multiprocessing 多线程在同一时间只能处理一个任务. 可把任务平均分配给每个核,而每个核具有自己的运算空间. 1.2 添加进程 Process 与线程类似,如下所示,但是 ...
- linux下FTP服务器搭建教程1
你买了个主机就像是买了块地皮,搭建FTP就像是盖房子,我在地皮上建房子,然后创建的用户就像是钥匙,我给谁钥匙(权限),谁就可以到我家去玩,去放东西,拿东西. 虽然我们买不起现实的房子,但是我们可以买互 ...
- 关于JDBC导入mysql的jar驱动的头痛
今天上午想写个小程序,需要调用数据库,查了书和各个博客. 最后卡在导入mysql驱动上了,花了1个多小时才让程序连上数据库. 这里有个小误区,你下载的是zip压缩文件,很多帖子写的都是让你导入驱动,但 ...
- 【Vue】Vue中的父子组件通讯以及使用sync同步父子组件数据
前言: 之前写过一篇文章<在不同场景下Vue组件间的数据交流>,但现在来看,其中关于“父子组件通信”的介绍仍有诸多缺漏或者不当之处, 正好这几天学习了关于用sync修饰符做父子组件数据双向 ...
- 一只菜鸟的瞎J8封装系列的目录
因为这是一个系列...也就是我们所说的依赖关系.后面很多方法都是基于我前面封装的工具来进行的,所以我列一个目录供大家参考... 一只菜鸟的瞎J8封装系列 一.手把手封装数据层之DButil数据库连接 ...