jquery ui對話框將不會打開

我想在用戶點擊一個錨鏈接之後打開一個Jquery UI對話框。jquery ui對話框將不會打開

我正在使用Jquery 1.5.2和UI 1.8.11，並沒有收到任何錯誤消息。我下面這個頁面上的例子：jquery ui dialog documentation

我的JS：

$(document).ready(function() { 
    $('#payTypeOptions').dialog({ 
    autoOpen: false, 
    height:600, 
    width: 600, 
    modal: true 
}); 

    $('#showPayTypeOptions').click(function(){ 
    $('#payTypeOptions').dialog('open'); 
    //If I put an alert() here, the alert shows 
    }); 

});

的HTML：

<a id="showPayTypeOptions">Do something</a> 

<div id="payTypeOptions"> 
<p>Content</p> 
</div>

感謝。

編輯：代碼沒有錯。這是導入過程中的用戶錯誤 - doh！

來源

2011-04-19 Matt

我以前也曾經遇到過這種情況，它與進口產品有關。要查看是否屬於這種情況，請嘗試以下腳本和樣式。嘗試：

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

來源

2011-04-19 19:09:20 ChrisThompson

感謝您的回答 - 這是一個與進口有關的問題。 – Matt 2011-04-19 19:20:19

$(document).ready(function() { 
    $('#payTypeOptions').dialog({ 
     autoOpen: false, 
     height:600, 
     width: 600, 
     modal: true 
    }); 

    $('#showPayTypeOptions').click(function(){ 
     $('#payTypeOptions').dialog('open'); 
     //If I put an alert() here, the alert shows 
    }); 
});

你必須圍繞交換他們，我想，在你第一次創建對話框，然後調用它。

來源

2011-04-19 19:09:02 SickHippie

哎呀 - 我忘了更改我的代碼回。我的代碼最初是按照這個順序，我換了它希望它可以解決問題。它沒有。 – Matt 2011-04-19 19:10:39

試試這個：

$(document).ready(function() { 
    $('#showPayTypeOptions').click(function(){ 

     $('#payTypeOptions').dialog({ 
      autoOpen: false, 
      height:600, 
      width: 600, 
      modal: true 
     }); 
    }); 
});

如果打開的模態見。如果確實如此，那麼在您嘗試打開它之前，您需要首先聲明該模塊。

來源

2011-04-19 19:10:55 Seth

感謝您的回答。 – Matt 2011-04-19 19:21:19

嘗試將對話框存儲在變量中並引用它。我已經成功做這種方式：

$(document).ready(function() { 
    var mydialog = $('#payTypeOptions').dialog({ 
    autoOpen: false, 
    height:600, 
    width: 600, 
    modal: true 
    }); 

    $('#showPayTypeOptions').click(function(){ 
    mydialog.dialog('open'); //Changed here 
    //If I put an alert() here, the alert shows 
    //Also, you should probably return false here to prevent the browser 
    // from following the link (or doing something weird since you don't have 
    // an href). 
    return false; 
    }); 

});

來源

2011-04-19 19:18:29

一旦你聲明的對話框（你之前「開放」），你可以使用DOM檢查（螢火蟲）審查DIV？一旦聲明對話框，你應該會看到很多由jQuery創建的附加標記。 UI的小部件，用戶界面，對話框等..

來源

2011-04-19 19:19:50 BZink

創建喜歡這裏http://pluksza.blogspot.com/2011/06/jquery-ui-dialog-open-good-practise.html和綁定事件功能按鈕

來源

2011-06-23 09:58:25 vitalisfan

我有一個非常類似的問題，但對於一個拆分我開模秒鐘後消失。我點擊了我的「打開對話框」按鈕，通過觀察Chrome開發工具元素選項卡中的HTML更改來制定解決方案。您必須記住，如果它是一個按鈕或鏈接，則會從單擊的元素返回false，否則您的頁面將被重新張貼或取消，並且會丟失對話框。所以，我的代碼看起來是這樣的：

$(document).ready(function() { 

    $('#payTypeOptions').dialog({ 
    autoOpen: false, 
    height: 600, 
    width: 600, 
    modal: true 
    }); 

    $('#showPayTypeOptions').click(function() { 
    $('#payTypeOptions').dialog('open'); 
    return false; // This makes all the difference in my case 
    }); 

});

希望這可以幫助別人

來源

2012-09-07 13:54:15 Mundo

jquery ui對話框將不會打開

回答

相關問題