是否可以使用jQuery在iPad的Safari浏览器上识别触摸事件?
我在Web应用程序中使用了mouseOver和mouseOut事件.iPad的Safari浏览器是否有类似的事件,因为没有像mouseOut,mouseMove这样的事件?
我有一个draggable()适用于Firefox和Chrome 的jQuery UI .用户界面概念基本上是单击以创建"post-it"类型项.
基本上,我点击或点击div#everything(100%高和宽)听取点击,并显示输入textarea.您添加文本,然后在完成后保存它.你可以拖动这个元素.这适用于普通浏览器,但在iPad上我可以测试,我无法拖动项目.如果我触摸选择(然后稍微变暗),我就无法拖动它.它根本不会向左或向右拖动.我可以向上或向下拖动,但我不是拖动个人div,我拖动整个网页.
所以这是我用来捕获点击的代码:
$('#everything').bind('click', function(e){
var elem = document.createElement('DIV');
STATE.top = e.pageY;
STATE.left = e.pageX;
var e = $(elem).css({
top: STATE.top,
left: STATE.left
}).html('<textarea></textarea>')
.addClass('instance')
.bind('click', function(event){
return false;
});
$(this).append(e);
});
Run Code Online (Sandbox Code Playgroud)
这里是我用来"保存"音符并将输入div转换为显示div的代码:
$('textarea').live('mouseleave', function(){
var val = jQuery.trim($(this).val());
STATE.content = val;
if (val == '') {
$(this).parent().remove();
} else {
var div = $(this).parent();
div.text(val).css({
height: '30px'
});
STATE.height = 30;
if ( div.width() !== div[0].clientWidth || div.height …Run Code Online (Sandbox Code Playgroud) 是否有任何解决办法使Jquery-ui可以在基于Android或IOS的触摸设备上进行排序?
我正在尝试建立一个网站,用户可以将一些项目(div中的一个项目)拖动到页面上的其他div.它不是一张桌子左右,只是在页面的某个地方划分.
使用html5拖放它运行良好,现在我尝试为移动设备执行此操作.我可以将项目拖动到div,将它们放在那里并阻止这个dropzone,因为只有一个元素应该在dropzone中.我也可以将这个元素拖到另一个div或页面上的其他地方(如果我犯了一个错误,可放置区域只能在第一次删除div时工作)但是我不能在div中删除另一个现在为空的项目再次.
如何再次启用Dropzone?
如果一个被拖到另一个div上,是否有可能改变两个div的位置?
这是我的代码的相关部分:
<script type="text/javascript">
$ (init);
function init() {
$(".dragzones").draggable({
start: handleDragStart,
cursor: 'move',
revert: "invalid",
});
$(".dropzones").droppable({
drop: handleDropEvent,
tolerance: "touch",
});
}
function handleDragStart (event, ui) {}
function handleDropEvent (event, ui) {
$(this).droppable('disable');
ui.draggable.position({of: $(this), my: 'left top', at: 'left top'});
ui.draggable.draggable('option', 'revert', "invalid");
}
</script>
<body>
<div id="alles">
<div class="dropzones" id="zone1"><div class="dragzones" id="drag1">Item 1</div></div>
<div class="dropzones" id="zone2"><div class="dragzones" id="drag2">Item 2</div></div>
<div class="dropzones" id="zone3"><div class="dragzones" id="drag3">Item 3</div></div>
<div class="dropzones" id="zone4"><div class="dragzones" id="drag4">Item 4</div></div>
<div class="dropzones" …Run Code Online (Sandbox Code Playgroud) 我正在编写一个可在iPad上查看的网页.它使用Safaris/Webkits拖放.我已经完全复制了Safari的示例拖放代码,但它无法正常工作.
我的问题:当我在Safari桌面上或在iPad上的Safari上运行网页(HTML,CSS和Javascript)时,永远不会触发ondrop事件.在ipad上我甚至无法拖动元素(当我握住并将手指移到元素上时,显微镜会出现并且它不会拖动).拖动确实在桌面上工作.
出了什么问题?
可以在本页的最底部找到小代码示例:https://developer.apple.com/library/archive/documentation/AppleApplications/Conceptual/SafariJSProgTopics/DragAndDrop.html
<!DOCTYPE html>
<html>
<head>
<title>Drag-and-Drop</title>
<script>
<!--
var dragitem = undefined;
function setdragitem(item, evt) {
dragitem = item;
// alert('item: '+item);
// item is an HTML DIV element.
// evt is an event.
// If the item should not be draggable, enable this next line.
// evt.preventDefault();
return true;
}
function cleardragitem() {
dragitem = undefined;
// alert('item: '+item);
}
function dodrag() {
// alert('item: '+dragitem);
}
// This is required---used to …Run Code Online (Sandbox Code Playgroud)