從onclick調用JQuery對話框

下面的HTML將顯示帶有2個按鈕的頁面。按照常規方式打開JQuery對話框 - 工作正常。從onclick調用JQuery對話框

另一個按鈕是嘗試打開一個非jquery函數的對話框 - 但它不工作。我認爲第二個按鈕不是應該如何完成的 - 但是由於我在這裏不會解釋的原因，我想知道這是否可能？

我是jquery的新手 - 所以我肯定有一些基本的東西比如命名空間等，我現在還不能完全理解。嘗試了許多方法讓它無法成功運行 - 我現在要求提供有關如何完成這項工作的建議。更一般的問題是關於「正常」的javascript如何引用和操縱JQuery函數。

可以這樣做嗎？

<!doctype html> 
<html> 
<head> 
    <title>My Dialog demo</title> 
    <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css" /> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/jquery-ui.min.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      var $dialog = $('<div></div>') 
      .html('My Dialog Demo...') 
      .dialog({ 
       autoOpen: false, 
       title: 'My Dialog' 
      }); 

      $('#Button1').click(function() { 
       $dialog.dialog('open'); 
       return false; ////cancel eventbubbeling 
      }); 
     }); 

     function showDialog() { 
      $dialog.dialog('open'); 
      return false //cancel eventbubbeling 
     } 

    </script> 

</head> 
<body> 
<!-- JQuery autowired event--> 
<button id="Button1">Open dialog (JQuery event wireup)</button> 
<!-- Manual --> 
<button id="Button2" onclick="showDialog();">Open (manual onClick event)</button> 
</body> 
</html>

來源

2012-06-25 Lars Kjeldsen

應該考慮升級jQuery來更新版本，你是很老。可以簡單地將腳本標記的src從「1.3.2」更改爲「1.7」，並將jQuery UI更改爲「1.8」。你遇到的一些代碼可能包括更新的方法 – charlietfl

感謝您的提示 - 將做到！ –

讓全地球$dialog這樣

<script type="text/javascript"> 
     var $dialog; 
     $(document).ready(function() { 
      $dialog = $('<div></div>') 
      .html('My Dialog Demo...') 
      .dialog({ 
       autoOpen: false, 
       title: 'My Dialog' 
      }); 

      $('#Button1').click(function() { 
       $dialog.dialog('open'); 
       return false; ////cancel eventbubbeling 
      }); 
     }); 

     function showDialog() { 
      $dialog.dialog('open'); 
      return false //cancel eventbubbeling 
     } 

    </script>

來源

2012-06-25 06:59:07

從onclick調用JQuery對話框

回答

相關問題