我是 html5 和 windows 商店应用程序的新手。我创建了一个项目,我希望我的图像能够拖动。首先对于鼠标拖动它工作得很好,但后来我在触摸设备上测试它不工作。这是图像:
这个是在非触摸设备上测试的,它可以工作:
这个是在触摸设备上测试的,它不起作用:
这是我的html:
<!DOCTYPE html>
<html>
<head>
<script src="script.js"></script>
<title>Drag and Drop</title>
</head>
<body>
<div id="content">
<div id="Store" style="border: solid 1px white;"></div>
<div id="right" style="border: solid 1px white;">
<img id="img1" src="/image/bugimgS1.png" />
</div>
</div>
</body>
</html>
这是我的脚本:
(function () {
WinJS.UI.Pages.define('DragandDrop.html',
{
ready: function ()
{
define();
}
});
function get(ID) { return document.getElementById(ID); }
function create(tag) { return document.createElement(tag); }
function define()
{
var r = get('Store');
var img1 = get('img1');
img1.addEventListener('dragstart', _dragStart, false);
r.addEventListener('dragenter', function (e) { e.preventDefault(); });
r.addEventListener('dragover', function (e) { e.preventDefault(); });
r.addEventListener('drop', _dropped, false);
function _dragStart(e) {
e.dataTransfer.setData('Text', e.target.id);
}
function _dropped(e) {
e.preventDefault();
var data = e.dataTransfer.getData('Text');
r.appendChild(document.getElementById(data));
}
}
})();
请我真的需要帮助才能使这个程序在触摸和非触摸设备上都工作。提前致谢。