我在主页面创建了一个iframe,并在里面放入了一个jsp页面。我要把点击iframe时动态创建的div进行拖拽,但是出了点问题。大家帮我来看看吧!
时间:2011-10-18
来源:互联网
这是实现拖拽的js函数
JScript code
我点击iframe所包含的页面中的一个span标签时动态加载一个div,并让这个div可以在主窗体(或者说主页面)上进行拖拽,所以我在动态创建这个可拖拽div时将其的onmousedown事件和上面的beginDrag这个js函数关联。这样的效果却是当我点击这个动态创建的div并对她进行拖拽时,传入js函数的event对象是空的,然后就报错了!而当我在iframe里面移动鼠标时,创建出来的div就会移动!!
我的初步判断是因为我想在主页面上,将通过子页面创建出来的div进行拖拽,所以在动态加载div时将onmousedown事件绑定beginDrag函数,传入js函数的event对象应该是主页面的event对象,而不是子页面的event对象。所以我觉得只要获取主窗体的event对象就可以在主窗体中拖拽。但event对象只有在触发一个事件时才会有值噢! 可不可以在动态创建div绑定onmousedown事件时,触发主页面的事件并获取主页面event对象,然后传入就ok了呢? 求解答,求速度!!
JScript code
//elementToDrag:进行拖拽的元素。event1:事件源。 function beginDrag(elementToDrag,event1) { //计算一个点和鼠标点击之间的距离,下面的嵌套的moveHandler函数需要这些值 var deltaX=event1.clientX-parseInt(elementToDrag.style.left); var deltaY=event1.clientY-parseInt(elementToDrag.style.top); // 注册mousedown事件后发生的mousemove和mouseup事件的处理程序 // 注意,它们被注册为文档的捕捉事件处理程序 // 在鼠标按钮保持按下的状态的时候,这些事件处理程序保持活动的状态 // 在按钮被释放的时候,它们被删除 document.attachEvent("onmousemove",moveHandler); document.attachEvent("onmouseup",upHandler); //我们已经处理了该事件,不要让别的元素看到它 event1.cancelBubble=true; event1.returnValue=false; /* 这是在元素被拖动时候捕捉mousemove事件的处理程序,它响应移动的元素 */ function moveHandler(e) { //把元素移动到当前的鼠标位置 e=window.event; elementToDrag.style.left=(event1.clientX-deltaX)+"px"; elementToDrag.style.top=(event1.clientY-deltaY)+"px"; //不要让别的元素看到该事件 event1.cancelBubble=true; } /* 该事件将捕捉拖动结束的时候发生的mouseup事件 */ function upHandler(e) { //注销事件处理程序 document.detachEvent("onmouseup",upHandler); document.detachEvent("onmousemove",moveHandler);} event1.cancelBubble=true; }
我点击iframe所包含的页面中的一个span标签时动态加载一个div,并让这个div可以在主窗体(或者说主页面)上进行拖拽,所以我在动态创建这个可拖拽div时将其的onmousedown事件和上面的beginDrag这个js函数关联。这样的效果却是当我点击这个动态创建的div并对她进行拖拽时,传入js函数的event对象是空的,然后就报错了!而当我在iframe里面移动鼠标时,创建出来的div就会移动!!
我的初步判断是因为我想在主页面上,将通过子页面创建出来的div进行拖拽,所以在动态加载div时将onmousedown事件绑定beginDrag函数,传入js函数的event对象应该是主页面的event对象,而不是子页面的event对象。所以我觉得只要获取主窗体的event对象就可以在主窗体中拖拽。但event对象只有在触发一个事件时才会有值噢! 可不可以在动态创建div绑定onmousedown事件时,触发主页面的事件并获取主页面event对象,然后传入就ok了呢? 求解答,求速度!!
作者: xp8283596 发布时间: 2011-10-18
GOOD
作者: zhangbaozhang 发布时间: 2011-10-18
引用 1 楼 zhangbaozhang 的回复:
GOOD
GOOD
帮我看看呗,那样你good我也good。 = =~
作者: xp8283596 发布时间: 2011-10-18
相关阅读 更多
热门阅读
-
office 2019专业增强版最新2021版激活秘钥/序列号/激活码推荐 附激活工具
阅读:74
-
如何安装mysql8.0
阅读:31
-
Word快速设置标题样式步骤详解
阅读:28
-
20+道必知必会的Vue面试题(附答案解析)
阅读:37
-
HTML如何制作表单
阅读:22
-
百词斩可以改天数吗?当然可以,4个步骤轻松修改天数!
阅读:31
-
ET文件格式和XLS格式文件之间如何转化?
阅读:24
-
react和vue的区别及优缺点是什么
阅读:121
-
支付宝人脸识别如何关闭?
阅读:21
-
腾讯微云怎么修改照片或视频备份路径?
阅读:28