您的位置：首页 > Web前端 > JavaScript

JS控件拖放，触发事件

2015-12-07 14:27 387 查看
先看如下代码：

<body>
<img src="Images/w3school_logo_black.gif" draggable="true" id="drag1" />
<video src="movie.ogg" width="320" height="240" controls="controls" style="position:absolute;left:400px;" ondrop="fun1()" ondragover="allowDrop(event)" >
Your browser does not support the video tag.
</video>

<script src="Scripts/jquery-1.11.3.min.js"></script>
<script src="Scripts/bootstrap.min.js"></script>
<script src="Scripts/MyDrag.js"></script>
<script src="Scripts/jquery.confirm.js"></script>

<script type="text/javascript">
function allowDrop(ev) {
ev.preventDefault();
}

function fun1() {
debugger;
iboAlertWarning("拖放操作");
}
</script>
</body>


如上，先将一个图片设置为 draggable="true" ，这样它就可以拖拽了。

我们的目的是，拖着图片拽到标签<video>上，然后松开鼠标，触发ondrop事件，但是要注意，

如果想要触发ondrop事件，还需要给<video>标签定义ondragover事件，函数体如上。
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航