如何在拖放操作期间删除已删除图像的属性?

时间:2012-01-03 18:41:15

标签: javascript drag-and-drop contenteditable

var holder = document.getElementById('cms');

holder.ondragstart =function(e)
{
dragID =e.srcElement.id;
dregCl =e.srcElement.getAttribute('class');
if(dragID ==='cms_tools'){ cmsPanel =document.getElementById('cms_tools'); }
}

holder.ondragover = function(e)
{
if(dragID ==='cms_tools')
{
cmsPanel.style.top = (e.clientY-7) +'px';
cmsPanel.style.left = (e.clientX-250) +'px'; }}

holder.ondragend = function(e)
{
delete window.dragID; 
if(dregCl ==='imglib'){
e.target.removeAttribute('width'); 
e.target.removeAttribute('height');
e.target.removeAttribute('class'); } }


holder.ondrop = function (e) 
{ 

}

看起来应该很简单。我在面板中放置了尺寸为width =和height =的图像,并且在放下图像时需要将它们删除。您现在看到的代码会执行此操作,但会将其应用于源图像而不是目标图像。我似乎无法找到应该是单字解决方案来解决被丢弃的图像而不是源图像。请保持答案限于标准的JavaScript,没有专有的库或复杂的建议。请不要仅仅因为此项目的要求不包含上述异常而关闭此主题。提前谢谢。

1 个答案:

答案 0 :(得分:0)

holder.ondragstart =function(e)
{
Img_Src_Drop =e.target.getAttribute('src');
dragID =e.srcElement.id;
dregCl =e.srcElement.getAttribute('class');
if(dragID ==='cms_tools'){ cmsPanel =document.getElementById('cms_tools'); }}
holder.ondragover = function(e)
{
if(dragID ==='cms_tools')
{
cmsPanel.style.top = (e.clientY-7) +'px';
cmsPanel.style.left = (e.clientX-250) +'px'; }}
holder.ondragend = function(e)
{
delete window.dragID; 
if(dregCl ==='imglib'){ 
e.preventDefault; 
document.execCommand('InsertImage',null,Img_Src_Drop); }}
holder.ondrop = function (e) 
{ e.preventDefault; }

这只是一个字,但解决方法是简单地阻止默认并插入新图像。不是我想要的,但它按预期工作。希望这篇文章可以帮助其他任何类似的人。