eddie

15 天前

拖拽结束后追加的HTML怎么才能执行之前的拖拽方法

本文作者:IMWeb eddie 原文出处:IMWeb社区 未经同意,禁止转载

<html> <meta charset="utf-8"> <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" /> <meta name="format-detection" content="telephone=no" /> <title>图标</title> <link href="css/common.css" rel="stylesheet" type="text/css"> <style> .modal { position: absolute; top: 100px; left: 100px; width: 300px; border: 1px solid #aaa; padding: 3px; border-radius: 5px; } .modal-header { height: 24px; line-height: 24px; background-color: #ddd; color: #222; padding: 5px; border-radius: 3px; } .modal-body { height: 100px; } .btn-close { width: 24px; height: 24px; float: right; padding: 3px; } </style> [removed][removed] [removed] $(function() { /* [draggable 拖拽方法] @param {[type]} modal [移动元素] @param {[type]} handle [拖拽元素] @param {[type]} cancle [排除元素] / var draggable = function(modal, handle, cancle) { var isDragging = false; var startX = 0, startY = 0, left = 0, top = 0; var dragStart = function(e) { var e = e || window.event; e.preventDefault(); // 获取需要排除的元素 isDragging = true; startX = e.clientX; startY = e.clientY; left = $(modal).offset().left; top = $(modal).offset().top; } var dragMove = function(e) { var e = e || window.event; e.preventDefault(); if (isDragging) { var endX = e.clientX, endY = e.clientY, relativeX = endX - startX, relativeY = endY - startY; $(modal).css({ left: relativeX + left + 'px', top: relativeY + top + 'px' }); } return false; } var dragEnd = function(e) { addHtml(); isDragging = false; } $(handle).on('mousedown', dragStart); $(document).on('mousemove', dragMove); $(document).on('mouseup', dragEnd); } function addHtml() { $("body").append('') } $(".modal").each(function() { var that = $(this) draggable(that, that); }) }) [removed] </head> <body> </body> </html>
0条评论

    您需要 注册 一个IMWeb账号或者 才能进行评论。