droppable

问题 now I'm trying to make a simple drag and drop game. The first time I drag and drop a clone works fine, but it doesn't allow me to drag a clone anymore. So I want to create as many clones as I drag.... and I have no idea how to do it. Please take a look at my code first. function init(){ var xCoordinate; var yCoordinate; var itemName; $('#burger, #chicken, #fries, #hotdog, #soda').draggable({ containment: '#screen', start: getPosition, helper: 'clone', stop: dragStop, revert: 'invalid' }); $('

问题 I am having a problem getting ui.draggable to work. I am hoping to be able to return its ID. All it returns is undefined, which I do not understand. Here is my droppable call.... $( ".currqcontainer" ).droppable({ accept: ".currqwrapper", drop: function (ui, event) { alert("dropped"); var testid = $(ui.draggable).attr('id'); alert(testid); } }); Here is my draggable initialization... $( ".currqwrapper" ).draggable({ revert: "invalid" }); I am creating the currqwrapper instances with this

问题 I'm trying to understand why $('#title').replaceWith('ha'); will work outside the drop: function(event, ui) {} area in jquery's droppable script, but it won't work inside. Specifically, if I do $(".droppable").droppable({ drop: function(event, ui) { $('#title').replaceWith('ha'); } I get a Runtime Error (line 1102) data(...).options is null or not an object . Also if I insert a $('#title').append('ha'); inside the drop:, it works. However if I put $('#title').replaceWith('ha'); anywhere else

问题 I'm new to jQuery and jQuery UI. I'm trying to move a div from a parent div to another. So far, My "article" is draggable. The "droppable" stock properly identifies the article as it's move above it, but I can't seem to find how to attach this article to the stock . I think I'm manipulating a "div encapsulating in a jQuery object", but I'm a bit lost here. <div id="shelf" class="shelf"> <div class="article">article</div> </div> <div id="stock" class="stock"> </div> Then I have a script that's

问题 I'd like to be able to drag an image into one of two containers (container 1 and container 2). From there, depending on which container the image was dropped to, I'd like to update that container with a database call (or just update a row in one of my tables). I'd like to use http://jqueryui.com/demos/droppable/ to achieve this, but I'm not sure how to process the request, and how to get each container to listen for an event handler (dropping of the image). I've drawn a really bad diagram

问题 I want to upload an image to server through an image url. this image is dragged and dropped to a droppable area. (Or is there a way to post the Image URL to another page in the javascript function?) How do I use this image in the droppable area to upload to the server using jquery or ajax. Like once I dropped the image then it will automatically upload to the server by using the image url(e.g http://dfghg.com/sss.jpg). the image (e.g http://dfghg.com/sss.jpg) is within the the same page as

问题 I have a list of draggable items, and I wish to be able to drag them onto a sortable content block. Here’s my markup: <div class='items'> <div class="one">One</div> <div class="two">Two</div> </div> <div class="content"> <div class="block">Foo</div> <div class="block">Bar</div> </div> The thing is, that I want the dragged item to "become" a block as soon as the dragging starts and remain a block when it’s dropped. I have tried this: $('.items div').draggable({ helper: function(e) { return $('

问题 I'm using jQuery and I have the following problem: In my site I have a chessboard with pieces. Every square is a simple div with the background property to show white or black. Over these squares (inside the divs) I've put an img tag referencing the piece that must be over that square. Something like: <div id="a8" class="square" style="background-image: url('/images/background_white.png')"> <img id="piece_a8" class="piece" src="/images/rook_black.png" /> </div> I can control the movement of

问题 I am trying to use jQuery sortable, droppable and draggable to work together. I have 3 lists: a break-point placeholder; report rows; report groups. The user should be able to: Drag as many placeholder copies into the 'report rows' list Drag one-at-a-time a single 'report group' (not a clone) into the 'report rows' collection (but not vice-verse)...until no more report groups are left. The user should be able to sort the report rows list ad nauseum. My problem is... I cannot get Number 2

问题 I have a schedule grid based on a HTML table using jQuery/jQuery UI drag and drop. Each cell in the table represents a user and timeslot. I've got good performance in IE9, FireFox, and Chrome however IE8 is unusable because there is a several second pause between the time a user starts a drag and the time the drag helper appears. I know part of the problem is that I am creating a large number of droppables, in this case: 112 Users on a 24 hour grid (total of 2688 droppables created) If I