我需要一些帮助。 我如何在 ipad 上实现此功能。它需要允许我拖动一组图像,每个图像在单击时都链接到一个单独的文件。现在拖动可以正常工作,但图像链接却不能。现在,如果注释掉 initTouch();,则图像链接将起作用。 我想让链接和拖动一起工作。
示例:
<head>
<link rel="stylesheet" href="Page2.css" />
<link rel="stylesheet" href="jquery.ui.all.css">
<script src="jquery-1.10.2.js"></script>
<script src="jquery.ui.core.js"></script>
<script src="jquery.ui.widget.js"></script>
<script src="jquery.ui.mouse.js"></script>
<script src="jquery.ui.draggable.js"></script>
<meta charset="utf-8">
<script>
$(function() {
$(document).ready(function (){initTouch(); });
$( "#draggable" ).draggable({ handle: "p.ui-widget-header" });
$( "#draggable" ).draggable({ cursor: "crosshair" });
$( "#draggable" ).draggable({ containment: "none" });
//这两行代码目前不起作用,除非我删除单词函数后的第一行//
$( "#image2" ).wrap('<a href="RateCard.html" target="_blank"></a>');
$( "#image3" ).wrap('<a href="RateCard2.html" target="_blank"></a>');
});
</script>
</head>
<body>
<div id="primaryContainer" class="primaryContainer clearfix">
<div id="box" class="clearfix">
</div>
<div id="box1" class="clearfix">
</div>
<p id="text">
<span id="effect">Commercial</span><br />
</p>
<div id="wood" class="clearfix">
<div id="draggable" class="ui-widget-content">
<p class="ui-widget-header"><img id="image" src="img/film1_01.png" class="image" /></p>
<img id="image1" src="img/film1_02.png" class="image" />
<img id="image2" src="img/film1_03.png" class="image" />
<img id="image3" src="img/film1_04.png" class="image" />
<img id="image4" src="img/film1_05.png" class="image" />
<img id="image5" src="img/film1_06.png" class="image" />
<img id="image6" src="img/film1_07.png" class="image" />
</div></div>
<p id="text1">
<span id="textspan1">Drag a film strip and select the video you want to see.</span><br />
</p>
</div>
</body>
最佳答案
因为只有当元素实际移动时才会调用 drag
事件。
在 mouseup
上:检查是否调用了可拖动 drag
事件,如果没有,则执行单击操作。
var dragInvoked=false;
$( "#draggable" ).draggable({
drag:function(){
dragInvoked= true;
}
});
$("#draggable").mouseup(function(){
if (!wasMoved){
doClickAction();
}
wasMoved=false;
});
关于javascript - 可同时拖动和点击,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23348398/