使用Google托管的最新jQuery/UI.我有以下标记:
<ul id="tree">
<li><a href="1/">One</a></li>
<li><a href="2/">Two</a></li>
</ul>
Run Code Online (Sandbox Code Playgroud)
以下javascript:
$(document).ready(function(){
// Droppable callbacks
function dragOver(overEvent, ui_object) {
$(this).mousemove(function(moveEvent){
console.log("moved over", this);
});
}
function drop_deactivate() {
$(this).unbind();
}
function drag_out() {
$(this).unbind();
}
// Actual dragging
$("#treeContainer li").draggable({
revert: true,
revertDuration: 0
});
// Actuall dropping
$("a").droppable({
tolerance: "pointer",
over: dragOver,
deactivate: drop_deactivate,
out: drag_out
});
Run Code Online (Sandbox Code Playgroud)
});
如果我将第一个li向下拖过第二个,则会触发mousemove函数(并且firebug会记录输出).但是如果我将第二个拖动到第li一个上面,则mousemove函数不会触发.你可以看到这个http://jsbin.com/ivala.是否有一个原因?我应该以其他方式捕获mousemove事件吗?
编辑:似乎认为mousemove()事件对于早期元素的绑定不是当前被拖动的元素(应该在鼠标悬停时绑定).
我似乎无法将元素拖动到可初始状态为隐藏的可排序列表(即display:none).
每行的html如下所示:
<div class="dragbox" id="item1" >
<h2>Expression 1<span id="exp1"></span></h2>
<div class="dragbox-content" >
<ul class="dragrow1"></ul>
<ul class="dragrow2"></ul>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
但是为了使一个字段能够被放入'dragrow*',div'dragbox-content'必须具有'display:block'的样式.这可以用主css样式编写,也可以硬编码到div本身(例如).
麻烦的是,在页面加载时,你有点想要关闭所有行(或者至少除了一行之外).这意味着'display'应该最初设置为'none'.这部分很容易.一些jQuery可以在ready()事件中的页面加载时更改此css:
$('.dragbox')
.each(function(){
$(this).find('.dragbox-content').hide();
});
Run Code Online (Sandbox Code Playgroud)
还有一个名为"toggle"的jQuery命令,当你单击h2标签时,会自动在block&none之间交换这个css显示.所以我可以显示或隐藏每一行.
因此......如果在ready()事件中显示了一行(display:block),则可以将项目拖动到可排序列表中(即使您在显示和隐藏行之间切换).
但是......如果在ready()事件中隐藏了一行(display:none),则无法将项目拖动到可排序列表中.
有任何想法吗?真的卡在这一个......
我有一个jQuery draggable()滑块,我想在某个事件中取消,但这会导致错误:'this.helper为null'.代码很简单:
$( '#magicalscrollhandle' ).draggable( 'cancel' );
Run Code Online (Sandbox Code Playgroud)
有任何想法吗?
我有一个可拖动的视图,我已使用以下代码设置:
#import <UIKit/UIKit.h>
@interface DraggableView : UIImageView {
CGPoint startLocation;
}
@end
#import "DraggableView.h"
@implementation DraggableView
- (id) initWithImage: (UIImage *) anImage
{
if (self = [super initWithImage:anImage])
self.userInteractionEnabled = YES;
return self;
}
- (void) touchesBegan:(NSSet*)touches withEvent:(UIEvent*)event
{
// Calculate and store offset, and pop view into front if needed
CGPoint pt = [[touches anyObject] locationInView:self];
startLocation = pt;
[[self superview] bringSubviewToFront:self];
}
- (void) touchesMoved:(NSSet*)touches withEvent:(UIEvent*)event
{
// Calculate offset
CGPoint pt = [[touches anyObject] locationInView:self];
float dx …Run Code Online (Sandbox Code Playgroud) 我想应用一个名为copie_contenue的函数来改变我在拖动原始文件后创建的副本上的div父ID,但是我的脚本更改了原始文件而不是副本我也尝试了ui.helper代替这个但没有发生任何事情
$('#model_1').draggable({
connectToSortable:'#global_div',
addClasses: false,
helper:'clone',
stop: function(e,ui) {
$(this).replaceWith(copie_contenue("model_1"));
}
})
Run Code Online (Sandbox Code Playgroud) 我有一个iFrame,我希望用户能够抓住它的一面并拖动它来调整它的大小.我不希望它实时调整大小,而是使用指标行,当用户发布时,它会调整大小.
我正在使用jQuery.
有帮助吗?
我有一个带有textarea的div.主div是可拖动的并且工作正常,但我无法在单击其中的textarea时拖动div.有没有办法拖动div即使我从div中的textarea拖动它?
这是我如何使我的div可拖动
$('.speech_bubble').draggable(
{
containment: $('#dropHere')
});
Run Code Online (Sandbox Code Playgroud)
谢谢
我正在尝试为iPhone创建一个HTML5 Web应用程序.我正在使用jQuery Mobile.我的应用程序涉及画布.它就像一个使用画布渲染草图的绘图应用程序.用户可以从任何方向在屏幕上滑动,应用程序应该能够找出位置,然后在点上画线.
jQuery Mobile仅为滑动控件提供以下一些基本事件,但我认为我需要对滑动进行更多控制,因为用户可以在任何方向滑动,并且可以是任何像素长.另一方面,我应该能够捕获大部分点,这样我就可以更清晰,更准确地想象绘图.
tap
Triggers after a quick, complete touch event.
taphold
Triggers after a held complete touch event (close to one second).
swipe
Triggers when a horizontal drag of 30px or more (and less than 20px vertically) occurs within 1 second duration.
swipeleft
Triggers when a swipe event occurred moving in the left direction.
swiperight
Triggers when a swipe event occurred moving in the right direction.
Run Code Online (Sandbox Code Playgroud)
我是否应该在画布中为iOs应用程序创建绘图应用程序?任何帮助将不胜感激.
我有一个小部件,我可以将物品放入垃圾桶.我希望能够在drop事件中为垃圾桶中丢弃的每个项目添加唯一ID.我怎么能这样做,有没有办法让输出值成为列表项的实际名称?谢谢!以下是我的代码:
$(function() {
var $gallery = $( "#gallery" ),
$trash = $( "#trash" );
$( "li", $gallery ).draggable({
cancel: "a.ui-icon",
revert: "invalid",
containment: $( "#demo-frame" ).length ? "#demo-frame" : "document", // stick to demo-frame if present
helper: "clone",
cursor: "move"
});
$trash.droppable({
accept: "#gallery > li",
activeClass: "ui-state-highlight",
drop: function( event, ui ) {
deleteImage( ui.draggable );
}
});
$gallery.droppable({
accept: "#trash li",
activeClass: "custom-state-active",
drop: function( event, ui ) {
recycleImage( ui.draggable );
}
});
Run Code Online (Sandbox Code Playgroud)
HTML
<div class="demo ui-widget …Run Code Online (Sandbox Code Playgroud) 我有许多Draggables和DragTargets。在Draggable上,我指定了child和feedback,但是我也希望它更改当Draggable进入DragTarget时的外观。我看不到任何办法。
每当我拖动Draggable时,我都会将其颜色更改为红色,但是,一旦它进入DragTarget,我就想将Draggable颜色更新为绿色。
我知道DragTarget.OnWillAccept,只要Draggable进入DragTarget就会调用此方法,但是我只有data。我尝试用新颜色更新数据,然后调用setState,但这似乎不起作用。
关于如何获得这种行为的任何建议?
我想要类似以下回调Draggable.onEnteringDragTarget和的内容Draggable.onLeavingDragTarget。