• 16.2.1拖拽事件


    通过拖拽事件,可以控制拖放相关的各个方面。其中最关键的地方在于确定哪里发生了拖放事件,有些事件是在被拖动的元素上触发的,

    而有些事件是在放置目标上触发的。拖动元素时,将依次触发以下事件:

    1、dragstart

    2、drag

    3、dragend

    按下鼠标键并开始移动移动鼠标时,会在被拖放的元素上触发dragstart事件。此时光标变成不能放符号,表示不能把元素放到自己上面。拖动开始时,可以通过ondragstart

    事件处理程序运行JavaScript代码。

    触发dragstart事件后,随即会触发drag事件,而且在元素被拖动期间会持续触发该事件。这个事件与mousemove事件相似,在鼠标移动过程中,mousemove事件也会持续发生。

    当拖动停止时(无论把元素放到有效的放置目标,还是放到了无效的放置目标上),会触发dragend事件。

    上述三个事件的目标都是被拖动的元素,默认情况下,浏览器不会在拖动期间改变被拖动元素的外观,但你可以自己修改。不过大多数浏览器会为正被拖动的元素创建一个半透明的副本,

    这个副本始终跟随着光标移动。

    当某个元素被拖动到一个有效的放置目标上时,下列事件会依次发生:

    1、dragenter

    2、dragover

    3、dragleave或drop

    只要有元素被拖动到放置目标上,就会触发dragenter事件(类似mouseover事件)。紧随其后的是dragover事件,而且在被拖动的元素还在放置目标的范围内移动时,

    就会持续触发该事件,如果元素被拖出放置目标,dragover事件不再发生,但会触发dragleave事件(类似于moveout事件)。

    如果元素被放到了放置目标中,则会触发drop事件而不是drapleave事件。上述三个事件的目标都是作为放置目标的元素。

  • 相关阅读:
    CCF201612-2 工资计算(100分)
    CCF201612-2 工资计算(100分)
    CCF201609-2 火车购票(100分)
    CCF201609-2 火车购票(100分)
    CCF201604-2 俄罗斯方块(100分)
    CCF201604-2 俄罗斯方块(100分)
    CCF201312-2 ISBN号码(100分)
    CCF201312-2 ISBN号码(100分)
    JSP---Sql Jdbc和MySql Jdbc
    JS---正则表达式验证
  • 原文地址:https://www.cnblogs.com/jokes/p/9959134.html
Copyright © 2020-2023  润新知