從jquery中的下拉框中刪除一個克隆

我有jQuery的拖動多邊盒來練習。我不知道如何在拖動項目後從刪除框中刪除項目的克隆。我對拖動的項目代碼...從jquery中的下拉框中刪除一個克隆

<script type="text/javascript"> 
    jQuery(document).ready(function(){ 
     //Counter 
     counter = 0; 
     //Make element draggable 
     jQuery(".drag").draggable({ 
      helper:'clone', 
      containment: 'frame', 

      //When first dragged 
      stop:function(ev, ui) { 
       var pos=jQuery(ui.helper).offset(); 
       objName = "#clonediv"+counter 
       jQuery(objName).css({"left":pos.left,"top":pos.top}); 
       jQuery(objName).removeClass("drag"); 


       //When an existiung object is dragged 
       jQuery(objName).draggable({ 
        containment: 'parent', 
        stop:function(ev, ui) { 
         var pos=jQuery(ui.helper).offset(); 
         //console.log($(this).attr("id")); 
      //console.log(pos.left) 
         //console.log(pos.top) 
        } 
       }); 
      } 
     }); 
     //Make element droppable 
     jQuery("#frame").droppable({ 
     drop: function(ev, ui) { 
     if (ui.helper.attr('id').search(/drag[0-9]/) != -1){ 
      counter++; 
      var element=jQuery(ui.draggable).clone(); 
      element.addClass("tempclass"); 
      jQuery(this).append(element); 
      jQuery(".tempclass").attr("id","clonediv"+counter); 
      jQuery("#clonediv"+counter).removeClass("tempclass"); 

      //Get the dynamically item id 
      draggedNumber = ui.helper.attr('id').search(/drag([0-9])/) 
      itemDragged = "dragged" + RegExp.$1 
      //console.log(itemDragged) 

      jQuery("#clonediv"+counter).addClass(itemDragged); 
     } 
      } 
     }); 
    }); 

    </script> 



<style id='flashfirebugstyle' type='text/css'>object,embed{visibility:hidden !important;}</style><script type='text/javascript'>window.addEventListener('load', function() {document.addEventListener('DOMNodeInserted', function(e) {if(e.target.tagName.toLowerCase() == 'object' || e.target.tagName.toLowerCase() == 'embed'){try{FlashFirebug_init();}catch(e){}}}, false);try{FlashFirebug_init();}catch(e){}},false);</script></head> 

<body> 

<div id="wrapper"> 
    <ul id="options"><span><h2> Components</h2></span> 
    <li id="drag1" class="drag"> 
     <textarea name="" cols="10" rows="5"></textarea>Text box<br> 
    </li> <!-- end of drag1 --> 
    <li id="drag2" class="drag"> 
    </li> <!-- end of drag2 --> 
    <li id="drag3" class="drag"> 
     <input type="submit" value="submit" />submit_button<br> 
    </li> <!-- end of drag3 --> 
    <li id="drag4" class="drag"> 
     <input type="radio" name="group1" value="radio-button"/> radio-button<br> 
    </li> <!-- end of drag4 --> 
    </ul><!-- end of options --> 
    <h2> Mockup Page</h2> 
    <div id="frame"> 
    <span id="title">Drag here</span> 
    <div id="tbldevs" > </div> 
    </div><!-- end of frame --> 
</div><!-- end of wrapper --> 
</body> 
</html>

我怎樣才能從下拉框中刪除該項目。

來源

2012-01-05 Jackson

我不確定我是否正確理解您的問題：您想刪除您之前丟棄在可丟棄區域中的元素？

如果這是關鍵，你可以看看這個小提琴：http://jsfiddle.net/scaillerie/YBPc4/。

一旦你刪除了一個元素，點擊一下它（但你可以使用任何其他事件！），它會刪除這個元素。這是這樣完成的：

jQuery("#frame").delegate(".ui-draggable", "click", function(e) { 
    if (e.ctrlKey) { 
     $(this).remove(); 
    } 
});

選擇器「ui-draggable」將下拉的元素檢索到div「frame」中。

來源

2012-01-05 09:49:38

從jquery中的下拉框中刪除一個克隆

回答

相關問題