我正在尝试查看单击按钮时将哪些图像放入 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;"> 
<img id="draggable2" src="images/windows.png" class="ui-widget-content" style="border: solid 1px; border-radius: 32px"> 
<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>