nil*_*vee 7 jquery jquery-mobile
我遇到了滑动事件的问题并拖动了一个元素.
在我的应用程序中,我使用swipeleft/-right在页面之间导航(它可以工作).在一个页面中有很多拖动元素(拖动工作).
所以问题是,当一个元素向右水平拖动时,swipeleft在dragstop之后工作.向左拖动也是如此,swiperight工作.
这让我感到困惑.
因此,当拖动元素时,是否可以停止或中断swipeleft/-right?
这是滑动的代码(来自Stackoverflow thx)
$('div.ui-page').live("swipeleft", function() {
var nextpage = $(this).next('div[data-role="page"]');
// swipe using id of next page if exists
if (nextpage.length > 0) {
$.mobile.changePage(nextpage, 'slide');
}
});
$('div.ui-page').live("swiperight", function() {
var prevpage = $(this).prev('div[data-role="page"]');
// swipe using id of next page if exists
if (prevpage.length > 0) {
$.mobile.changePage(prevpage, 'slide', true);
}
});
Run Code Online (Sandbox Code Playgroud)
这是拖拽的代码
$ (function(){
var numbers = [ 1, 2, 3, 4, 5 ];
numbers.sort( function() { return Math.random() - .5 } );
alert(numbers);
for ( var i=1; i<6; i++ ) {
$('#'+i).attr( 'src','bilder/'+numbers[i-1]+'.png' ).draggable( {
cursor: 'move',
containment: $('#'+i).parent().parent(),
revert: true,
});
}
});
Run Code Online (Sandbox Code Playgroud)
好的,现在我得到了解决方案:
ov 的答案是正确的,根据 ahren 的提示我已经解决了它。
这里要解释的是代码:
var moveme=false; // global variable is false(by default) when no element is dragged
$('div.ui-page').live("swipeleft", function (event){
if(moveme===true){event.preventDefault(); return false;}
var nextpage = $(this).next('div[data-role="page"]');
// swipe using id of next page if exists
if (nextpage.length > 0) {
$.mobile.changePage(nextpage, 'slide',true);
}
});
$('div.ui-page').live("swiperight", function(event){
if(moveme===true){event.preventDefault(); return false;}
var prevpage = $(this).prev('div[data-role="page"]');
// swipe using id of next page if exists
if ( prevpage.length > 0) {
$.mobile.changePage(prevpage, 'slide', true);
}
});
Run Code Online (Sandbox Code Playgroud)
可拖动代码:
$ (function(){
var numbers = [ 1, 2, 3, 4, 5 ];
numbers.sort( function() { return Math.random() - .5 } );
alert(numbers);
for ( var i=1; i<6; i++ ) {
$('#'+i).attr( 'src','bilder/'+numbers[i-1]+'.png' ).draggable( {
cursor: 'move',
containment: $('#'+i).parent().parent(),
revert: true,
start: function(){moveme=true;}, //if an element is dragged moveme=true and
//event.preventDefault() is used. So it is not possible to swipe
stop: function(){moveme=false;}, //after dragging swipe can be used (default)
});
}
});
Run Code Online (Sandbox Code Playgroud)
所以,非常感谢 ov 和 ahren 的帮助
| 归档时间: |
|
| 查看次数: |
1662 次 |
| 最近记录: |