2012-02-05 109 views
1

我有一個JavaScript函數showAlert()。有一個可拖動的圖像。拖動停止後,我們需要顯示警報。它不工作我們如何糾正它?jQuery ui.draggable不調用自定義函數

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head runat="server"> 

    <title></title> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
    <script src="Scripts/ui.core.js" type="text/javascript"></script> 
    <script src="Scripts/ui.draggable.min.js" type="text/javascript"></script> 

    <script type="text/javascript"> 

     $(function() 
     { 

      $("#d1").draggable(
      { 

       drag: function (event, ui) 
       { 
       }, 

       stop: function (event, ui) 
       { 
        showAlert(); 
       }, 

       cursor: "move" 

      }); 

     }); 

     function showAlert() 
     { 
      alert("hai"); 
     } 



    </script> 

</head> 
<body> 
    <form id="form1" runat="server"> 
    <div style="border:2px solid orange; width:500px; height:300px;" > 
    <br /> 
     <img src="MyIMages/RedSquare.jpg" alt="" id="d1" runat="server" /> 
    <br /> 
    </div> 
    </form> 
</body> 
</html> 

回答

1

我試着用了jQuery UI庫,它的工作http://jsfiddle.net/5HyyP/

+0

是的,我看到它在你的jsfiddle.net代碼中工作。奇怪。當我從Visual Studio運行它時,爲什麼它在我的場景中不起作用? – Lijo 2012-02-05 11:15:52

+2

唯一的區別是,我使用了CDN的JS庫,檢查您的JS文件或檢查您的瀏覽器JS控制檯,以查找是否有任何錯誤。 – tmjam 2012-02-05 11:18:22

+0

謝謝。它工作時,我使用CDN src =「http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js」。 – Lijo 2012-02-05 11:22:01

1

的圖像在服務器上運行,所以渲染ID是不同的,並且腳本沒有發現它的使用方法:更改JavaScript的

$("#<%=d1.ClientID%>").draggable(
     { 

或更改圖片,請刪除運行=服務器

<img src="MyIMages/RedSquare.jpg" alt="" id="d1" /> 
+0

我厭倦了這兩個approa CHES。他們兩人都沒有工作。你自己嘗試過嗎? – Lijo 2012-02-05 10:25:58

+0

@Lijo嘗試在頁面加載後加載它。 – Aristos 2012-02-05 10:55:21