Question

问题出在以“ mouseup”事件开头的代码段中。当我将.tile图像拖放到.amherst div上时，我试图获取警报以显示该图像。 div，但没有警报显示。

我是使用Javascript / jQuery的真正的初学者编程。我不知道如何在条件中包含position（）函数，但是在网络上找到了一些示例-但我仍然不确定我是否正确理解了这一部分。而且我不确定在这里使用“ this”。

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
.container{              
    position:relative;
}
.tampa{
    position:absolute;
    top:418px;
    left:907px;
    width:250;
}
.tile{
    width:47px;
    height:47px;
}
#tile0{
    position:absolute;
    top:590px;
    left:328px;
}
#tileH{
    position:absolute;
    top:590px;
    left:375px;
}
#tileF{
    position:absolute;
    top:590px;
    left:422px;
}
#tileR{
    position:absolute;
    top:590px;
    left:469px;
}
.img{
    width:100%; 
    height:auto;
}
.amherst{
    position:absolute;
    top:417px;
    left:827px;
}
</style>
<script src="jQ/jQuery.js"></script>
<script src="jQ/jquery-ui-1.12.1/jquery-ui.js"></script>
<script>
  $("document").ready(function(){
    $('.tile').mouseup(function(){
       if ($(this).position().top==417 && 
           $(this).position().left==827){ 
              alert("Hello");
           }
       });
     $('.tampa').click(function(){
       if ($('.tampa').attr('src')== 'GamePremiseOff.jpg'){
         $('.tampa').attr('src', 'GameConclusionOff.jpg');
       } else if ($('.tampa').attr('src')== 'GameConclusionOff.jpg'){
         $('.tampa').attr('src', 'GamePremiseOff.jpg');
       }
     });
     $('#tile0').draggable({snap:".amherst"});
     $('#tileH').draggable({snap:".amherst"}); 
     $('#tileF').draggable({snap:".amherst"});
     $('#tileR').draggable({snap:".amherst"});
   });
</script>
</head>
<body>
<div class="amherst"></div>
<div class="container">
  <img src='GameboardCompleteDemo.jpg' width='1620' height='740'>
  <img class='tampa' src='GamePremiseOff.jpg'>
  <img id='tile0' class='tile' src='GameTile0.jpg'>
  <img id='tileH' class='tile' src='GameTileH.jpg'>
  <img id='tileF' class='tile' src='GameTileF.jpg'>
  <img id='tileR' class='tile' src='GameTileR.jpg'>
</div>
</body>
</html>

我希望显示警报，但没有，并且没有收到错误消息

Answer 1

您的$（'。tile'）。mouseup（具有非常严格的定位）很可能永远不会发出警报。如果需要的话，需要在可拖动完成后调用它，这意味着回调或jQuery stop事件都可以在演示中进行：http://www.tutorialspark.com/jqueryUI/jQuery_UI_Draggable_Start_Stop_Events.php。尝试在停止功能中编写警报，如下所示：

stop: function() { alert('hi') }

我遇到了问题，包括条件

1 个答案: