Форум

gof · #1 (**permalink**) 18.05.2014, 02:01

Есть два элемента которые могут перетаскиваться.

$( "#draggable,#draggable2" ).draggable();

Перетаскиваются на поле:

$( "#droppable" ).droppable({
                accept: "#draggable,#draggable2";})

Как определить какой именно элемент был перетащен? Не где не могу найти ...
Спасибо!

рони · #2 (**permalink**) 18.05.2014, 09:34

Сообщение от gof

accept: "#draggable,#draggable2";})

точка с запятой зачема?

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title>demo</title>
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  <style type='text/css'>
  .wrapper{margin:20px auto}
  #block1,#droppable{border:solid 1px #555555;margin:10px;padding:20px;-moz-border-radius:5px;-webkit-border-radius:5px;float:left;height:335px ;min-width:100px}
  .textBlock{cursor: pointer;border:solid 1px #333333;font-weight:bold;margin:10px 0 5px 0;padding:10px;text-align:center;background:#eee;-moz-border-radius:3px;-webkit-border-radius:3px}
  #droppable{
    padding:0px;
    width:335px;height:335px ;
    background-color: #4169E1;
  }
  #droppable div{
      width:40px;height:40px ;
      background-color:  #DEB887;
      position:   absolute;
  }
  </style>
<script type='text/javascript'>
	$(window).load(function ()
	  {
	    $("#draggable,#draggable2").draggable();
	    $("#droppable").droppable(
	      {
	      drop: function (event, ui) {
	          alert(ui.draggable[0].id)
	        },
	      accept: "#draggable,#draggable2"}
	    )
	  }
	);
</script>
</head>
<body>
      <div class="wrapper">
        <div id="block1" class="">
            <div class="textBlock ui-state-default" id="draggable">draggable</div>
            <div class="textBlock ui-state-default" id="draggable2">draggable2</div>
        </div>
        <div id="droppable" class="">перетащите сюда блоки</div>
     </div>
</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript