2

Hello i am developing a drag and drop app. I have a DIV that is draggable along the document and there are some other divs in the document, I can drag one div to other divs, and this make mess to page i want to drop it NOT in another div like him i want to drop it in empty place and to disable the drop in another div for example if the class of the div that i trying to droping is cart-item not let him do the drop

<div id="cart">
<h1 class="ui-widget-header">Demonstration Site</h1>
<div class="ui-widget-content">
<ol id="insert-zone" class="ui-droppable ui-sortable">
<div class="item-container cart-item">
<div class="item-container cart-item">
<div class="item-container cart-item">
<div class="item-container cart-item">
<div class="item-container cart-item">
<div class="item-container cart-item">
<div class="item-container cart-item">
<div class="item-container cart-item">
<div class="item-container cart-item">
<div class="item-container cart-item">
</ol>
</div>
</div>

i tried to do this but this not working

}).sortable({
   // items: "div:not(.placeholder)",

   items:"div:not(.insert-zone-End-of-Page)",   //prevents objects from dragging
    sort: function() {
     $(this).removeClass("ui-state-default");
   if( $(this).class!="cart-item") var position = $(this).offset(); 
     console.log($(this).class!="cart-item");

This is the full cart-item div

<div class="item-container cart-item">
<div class="SetDefault">
<span></span>
</div>
<img border="0" title="Double click to Set Default Cat" src="http://www.myengravedjewelry.com/images/products/medium_101-01-071-08.jpg" alt="2027">
<div class="item-header">
<div class="item-body">
<ul class="item-ul">
<li>
<span>ShortId: 2027.</span>
</li>
<li>
<li>
<li>
<li>
</ul>
</div>
</div>
<div class="item-footer"></div>
</div>
4

1 に答える 1

1

これはあなたのために働きますか（フィドル）：

 $('.content').sortable({
    items: "div.item-container", //prevents objects from dragging
    sort: function () {
        $(this).removeClass("ui-state-default");
        if ($(this).class != "cart-item") var position = $(this).offset();
        console.log($(this).class != "cart-item");
    }
});

<div id="cart">
     <h1 class="ui-widget-header">Demonstration Site</h1>

    <div class="content ui-widget-content">
        <ol id="insert-zone" class="ui-droppable ui-sortable">
            <div class="item-container cart-item">Item 1
                <br/>
                <div>Dont move me here</div>
            </div>
            <div class="item-container cart-item">Item 2</div>
        </ol>
    </div>
</div>
<div class='danger'></div>
于 2013-06-27T13:14:38.147 に答える