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！

答

我以前也曾经遇到过这种情况，它与进口产品有关。要查看是否属于这种情况，请尝试以下脚本和样式。尝试：

<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>

感谢您的回答 - 这是一个与进口有关的问题。 – 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 
    }); 
});

你必须围绕交换他们，我想，在你第一次创建对话框，然后调用它。

哎呀 - 我忘了更改我的代码回。我的代码最初是按照这个顺序，我换了它希望它可以解决问题。它没有。 – Matt 2011-04-19 19:10:39

答

试试这个：

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

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

如果打开的模态见。如果确实如此，那么在您尝试打开它之前，您需要首先声明该模块。

感谢您的回答。 – 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; 
    }); 

});

答

一旦你声明的对话框（你之前“开放”），你可以使用DOM检查（萤火虫）审查DIV？一旦声明对话框，你应该会看到很多由jQuery创建的附加标记。 UI的小部件，用户界面，对话框等..

答

创建喜欢这里http://pluksza.blogspot.com/2011/06/jquery-ui-dialog-open-good-practise.html和绑定事件功能按钮

答

我有一个非常类似的问题，但对于一个拆分我开模秒钟后消失。我点击了我的“打开对话框”按钮，通过观察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 
    }); 

});

希望这可以帮助别人

jquery ui对话框将不会打开

相关推荐