WEB开发网
开发学院网页设计JavaScript JavaScript 拖放效果 —— 小拖放也有大智慧 阅读

JavaScript 拖放效果 —— 小拖放也有大智慧

 2010-09-14 13:25:12 来源:WEB开发网   
核心提示: 【默认动作】对选择状态的文本内容、连接和图片等进行拖放操作会触发系统的默认动作,例如ie中拖动图片鼠标会变成禁止操作状态,JavaScript 拖放效果 —— 小拖放也有大智慧(8),这样会导致这个拖放程序执行失败,不过ie在设置了setCapture之后,但这种方法只能禁止拖放对象本身被

【默认动作】

对选择状态的文本内容、连接和图片等进行拖放操作会触发系统的默认动作,例如ie中拖动图片鼠标会变成禁止操作状态,这样会导致这个拖放程序执行失败。

不过ie在设置了setCapture之后,通过用户界面用鼠标进行拖放操作和内容选择都会被禁止。

意思就是setCapture之后就不能对文档内容进行拖放和选择,注意这里的拖放是指系统的默认动作,例如ondragstart就不会被触发。

不过如果setCapture的参数是false的话,容器内的对象还是可以触发事件的(具体看鼠标捕获部分),所以setCapture的参数要设成true或保留默认值。

而ff的鼠标捕获没有这个功能,但可以用preventDefault来取消事件的默认动作来解决:

oEvent.preventDefault();

ps:据说使用preventDefault会出现mouseup丢失的情况,但我在ff3中测试没有发现,如果各位发现任何mouseup丢失的情况,务必告诉我啊。

【清除选择】

ie在设置setCapture之后内容选择都会被禁止,但也因此不会清除在设置之前就已经选择的内容,而且设置之后也能通过其他方式选择内容,

例如用ctrl+a来选择内容。

ps:onkeydown、onkeyup和onkeypress事件不会受到鼠标捕获影响。

而ff在mousedown时就能清除原来选择的内容,但拖动鼠标,ctrl+a时还是会继续选择内容。

不过在丢弃了系统默认动作之后,这样的选择并不会对拖放操作造成影响,这里设置主要还是为了更好的体验。

以前我用禁止拖放对象被选择的方法来达到目的,即ie中设置拖放对象的onselectstart返回false,在ff中设置样式MozUserSelect(css:-moz-user-select)为none。

但这种方法只能禁止拖放对象本身被选择,后来找到个更好的方法清除选择,不但不影响拖放对象的选择效果,还能对整个文档进行清除:

上一页  3 4 5 6 7 8 9 10  下一页

Tags:JavaScript 效果 智慧

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接