jQuery对话框弹出窗口

我试图让这个对话框弹出窗体显示在点击此链接但它不适合我。 过去三个小时我一直在研究这个问题,这对我来说太令人沮丧了。

这是我的HTML:

Contact Us 

appear now

这是我的JavaScript,这是在外部文件中:

 $("#contactUs").click(function() { $("#dialog").dialog("open"); return false; }); 

我使用过这些链接,但对我无济于事:

  • http://jqueryui.com/demos/dialog/#modal
  • http://jqueryui.com/demos/dialog/#default

如果有想法请告诉我,非常感谢,谢谢。

这个HTML很好:

 Contact Us 

appear now

您需要初始化Dialog(不确定您是否这样做):

 $(function() { // this initializes the dialog (and uses some common options that I do) $("#dialog").dialog({ autoOpen : false, modal : true, show : "blind", hide : "blind" }); // next add the onclick handler $("#contactUs").click(function() { $("#dialog").dialog("open"); return false; }); }); 

您的问题出在对话的调用上

如果你没有初始化对话框,你不必通过“打开”它显示:

 $("#dialog").dialog(); 

此外,此代码需要在$(document).ready(); function或低于其工作的元素。

使用下面的代码,它对我有用。

  

这很简单,必须添加第一个HTML:

 

然后,它必须初始化:

  

在此之后,您可以通过代码显示它:

 jQuery( '#dialog' ).dialog( 'open' ); 

您可以使用以下脚本。 它对我有用

模态本身由一个主模态容器,一个标题,一个正文和一个页脚组成。 页脚包含动作,在这种情况下是OK按钮,标题包含标题和关闭按钮,主体包含模态内容。

  $(function () { modalPosition(); $(window).resize(function () { modalPosition(); }); $('.openModal').click(function (e) { $('.modal, .modal-backdrop').fadeIn('fast'); e.preventDefault(); }); $('.close-modal').click(function (e) { $('.modal, .modal-backdrop').fadeOut('fast'); }); }); function modalPosition() { var width = $('.modal').width(); var pageWidth = $(window).width(); var x = (pageWidth / 2) - (width / 2); $('.modal').css({ left: x + "px" }); } 

参考: – 在asp.net中使用jquery进行模态弹出

您可以查看以下链接: http : //jqueryui.com/dialog/

此代码应该可以正常工作

 $("#dialog").dialog();