2012-04-19 40 views
1

對於我的項目,我需要彈出一個圖像,當我按下按鈕。 我正在嘗試使用SimpleDialog插件,您可以通過here查看該插件。 我這樣做是在我的HTMLsimpleDialog插件將無法工作

<p>This shows standard, default popup only mode.</p> 
      <script type="text/javascript"> 
       $(document).delegate('#popupbut', 'click', function() { 
        $('<div>').simpledialog2({ 
         mode: 'blank', 
         headerText: 'Some Stuff', 
         headerClose: true, 
         blankContent : 
          "<ul data-role='listview'><li>Some</li><li>List</li><li>Items</li></ul>"+ 
          "<a rel='close' data-role='button' href='#'>Close</a>" 
        }) 
       }); 
      </script> 
      <a href="#" id="popupbut" data-role="button">Open Dialog</a> 

我已經正確包括JS和CSS。但由於某種原因,它不起作用。 有沒有人有想法?或者SimpleDialog插件的其他替代方案?

親切的問候

------ 編輯 ------- 確定我得到它與上面的例子工作。 但現在我只想顯示圖像。所以我在我的劇本中這樣做。

$(document).delegate('#opendialog', 'click', function() { 
        // NOTE: The selector can be whatever you like, so long as it is an HTML element. 
        // If you prefer, it can be a member of the current page, or an anonymous div 
        //  like shown. 
          $('<div>').simpledialog2({ 
         mode: 'blank', 
          headerText: 'Some Stuff', 
          headerClose: true, 
          blankContent : 
          "<img src="images/schema.jpg" alt="schema" width="100" height="100" />" 


}) 
      }) 

但這不會工作。任何人都可以幫忙?

+0

你是否通過螢火蟲檢查錯誤? – 2012-04-19 07:21:52

+0

是的,它不會給出任何錯誤。 – Steaphann 2012-04-19 07:25:16

回答

0

更新我的帖子,這應該工作。

<!DOCTYPE HTML> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Test</title> 
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css" /> 
<link rel="stylesheet" type="text/css" href="http://dev.jtsage.com/cdn/simpledialog/latest/jquery.mobile.simpledialog.min.css" /> 

<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script> 
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script> 
<script type="text/javascript" src="http://dev.jtsage.com/cdn/simpledialog/latest/jquery.mobile.simpledialog2.min.js"></script> 


</head> 
<body> 
<script type="text/javascript"> 
$(document).delegate('#opendialog', 'click', function() { 
    $('<div>').simpledialog2({ 
    mode: 'blank', 
    headerText: 'Some Stuff', 
    headerClose: true, 
    dialogAllow: true, 
    dialogForce: true, 
    blankContent : 
     "<img src=\"images/schema.jpg\" alt=\"schema\" width=\"100\" height=\"100\" />"+ 
     "<a rel='close' data-role='button' href='#'>Close</a>" 
    }) 
}) 
</script> 

<a href="#" id="opendialog" data-role="button">Open Dialog</a> 

</body> 
</html> 
+0

好吧,這個工程,但現在我有一個在這個簡單的對話框中放置圖像的問題。我編輯了我的問題 – Steaphann 2012-04-19 07:51:28

+0

你刪除了很多代碼... – Scriptor 2012-04-19 08:45:20

+0

喜歡什麼?當我僅在其工作的空白內容中放置「

測試對話框

」時。 – Steaphann 2012-04-19 08:47:46