无法辨别图像是否在div中丢失

时间:2013-09-07 05:17:29

标签: jquery jquery-ui

我正在尝试查看按钮单击时已将哪些图像放入div中。我有一个console.log,无论我是否丢弃它都会出现错误。有人可以帮助我......

<!DOCTYPE HTML>
<html>
<head>
 <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
 <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">
body{background-color: #505050; color: #FFFFFF;}
#wrap{width: 99%; margin: 45px auto; text-align: center;}
#div1 {width: 440px;height: 65x;padding:10px;border:3px solid #aaaaaa; margin: 20px auto 20px auto; text-align: left;}
#div2 {width:440px;height:440px; border: solid 1px; border-radius: 220px; -webkit-border-radius: 250px; -moz-border-radius: 25opx; margin: 20px auto 20px auto; text-align: center;}

</style>
  <script>
  var drag1 = false;
  var drag2 = false;
  var drag3 = false;

  $(function() {
    $( "#draggable1" ).draggable();
    $( "#draggable2" ).draggable();
    $( "#draggable3" ).draggable();

    $( "#div2" ).droppable({
      drop: function( event, ui ) {
        $( this )
          .addClass( "ui-state-highlight" )
            .html( "Dropped!" );

      }

    });
  });
  </script>
</head>
<body>
<div id="wrap">

   <!--<h3>Drag icons(represent tables) into the circle(represents the entire database)</h3>-->
   <div id = "div1" class="ui-widget-header">
   <img id="draggable1" src="images/linux.png" class="ui-widget-content" style="border: solid 1px; border-radius: 32px;">&nbsp
   <img id="draggable2" src="images/windows.png" class="ui-widget-content" style="border: solid 1px; border-radius: 32px">&nbsp
   <img id="draggable3" src="images/apple.png" class="ui-widget-content"  style="border: solid 1px; border-radius: 32px">
   </div>
<div id="div2" class="ui-widget-header"></div>
<input type="button" value="run" onclick="getDivValues()"/>
</div>

  <script>
  function getDivValues(){
    if($("#div2").find("#draggable1")){
        drag1 = true;
        console.log("drag1: " + drag1);
    }
    else if(!$("div2").find("#draggable1")){
        drag1 = false;
        console.log("drag1: " + drag1);
    }
  }
  </script>
</body>
</html>

0 个答案:

没有答案