Question

新的preoblem！我需要在Ipad / Iphone上使用它

Internet Explorer问题已解决！

更改了ev.dataTransfer.setData（＆＃34; content＆＃34;，ev.target.id）;到ev.dataTransfer.setData（＆＃34; Text＆＃34;，ev.target.id）;

我正在进行网络教育，其中一部分是拖放查询。它在Chrome和Firefox中运行得很好，但它在资源管理器中无法正常工作。我是JS的新手，并不熟悉MS＆＃34;标准＆＃34;差异是。请原谅我的英语不好但不是我的母语。

JS代码：

var i = 0;

function allowDrop(ev)
{
  ev.preventDefault();
}

function drag(ev)
{
  ev.dataTransfer.setData("content",ev.target.id);
}

function drop(ev)
{
  ev.preventDefault();
  var image =ev.dataTransfer.getData("content");

  if (ev.target.id == document.getElementById(image).getAttribute('data-div'))
  { 
    ev.target.appendChild(document.getElementById(image));
    i++;

if(i == 9)
{
    document.getElementById('next').style.display="inline";
}
  }
  else
  {
     alert("Wrong");
  }
}

Html代码：

<div id="box">
    <div class="drop" id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
    <div class="drop" id="div2" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
    <div class="drop" id="div3" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
    <div class="drop" id="div4" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
    <div class="drop" id="div5" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
    <div class="drop" id="div6" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
    <div class="drop" id="div7" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
    <div class="drop" id="div8" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
    <div class="drop" id="div9" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
</div>

<div id="pic">
    <img class="drag" id="drag1" data-div="div1" src="http://images.stockfreeimages.com/866/sfi/free_8660001.jpg" draggable="true" ondragstart="drag(event)">
    <img class="drag" id="drag2" data-div="div2" src="http://images.stockfreeimages.com/866/sfi/free_8660001.jpg" draggable="true" ondragstart="drag(event)">
    <img class="drag" id="drag3"  data-div="div3" src="http://images.stockfreeimages.com/866/sfi/free_8660001.jpg" draggable="true" ondragstart="drag(event)">
    <img class="drag" id="drag4"  data-div="div4" src="http://images.stockfreeimages.com/866/sfi/free_8660001.jpg" draggable="true" ondragstart="drag(event)">
    <img class="drag" id="drag5"  data-div="div5" src="http://images.stockfreeimages.com/866/sfi/free_8660001.jpg" draggable="true" ondragstart="drag(event)">
    <img class="drag" id="drag6"  data-div="div6" src="http://images.stockfreeimages.com/866/sfi/free_8660001.jpg" draggable="true" ondragstart="drag(event)">
    <img class="drag" id="drag7"  data-div="div7" src="http://images.stockfreeimages.com/866/sfi/free_8660001.jpg" draggable="true" ondragstart="drag(event)">
    <img class="drag" id="drag8"  data-div="div8" src="http://images.stockfreeimages.com/866/sfi/free_8660001.jpg" draggable="true" ondragstart="drag(event)">
    <img class="drag" id="drag9"  data-div="div9" src="http://images.stockfreeimages.com/866/sfi/free_8660001.jpg" draggable="true" ondragstart="drag(event)">
</div>

<div id="next"> 
    <a href="q2.php" target="content"> Nästa </a>
</div>

我在其他一些文件中使用这个JS代码来解决资源管理器问题：

var CB = 
{
addEvent : function(element, event, action)
{
    if (element.addEventListener)
    {
        element.addEventListener(event, action, false);
    }
    else
    {
        element.attachEvent("on" + event, action);
    }
}
}

非常感谢帮助

//了Emil

Answer 1

IE不通过函数参数发送事件，而是作为window对象的一部分发送。由于您调用了事件参数ev，因此它不知道这实际上是event。

如果您想在IE中使用该事件，您必须将以下行写为每个窗口的第一行代码（在您的情况下）：

ev = ev || window.event;

或者您可以使用ev替换代码中的event的每个实例，因为可以隐式使用window参数。

来源：http://javascript.info/tutorial/obtaining-event-object

用于拖放图像的JavaScript无法在Ipad / Iphone上运行

1 个答案: