创建一个对话框JQuery Mobile

前端之家收集整理的这篇文章主要介绍了创建一个对话框JQuery Mobile前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我试图用Jquery mobile创建一个对话框.我试图参考接受的答案 in this SO question,但对我来说并不奏效.

这是我的代码

  1. <div data-role="page" id="first">
  2. <!-- Code -->
  3. <div id = "dialog" data-rel="dialog">
  4. <div id = "errorText"></div>
  5. <button id = "closeDialog">OK</button>
  6. </div>
  7. </div>

这里是JS做出的(在一个函数内):

  1. //Nothing checked. Cannot continue. Add error message to div
  2. $('#errorText').html("You must check the checkBox next to \"I Agree\" to continue");
  3. //Open Dialog
  4. $('#dialog').dialog();

当创建对话框的代码没有发生什么.建议?

解决方法

对话框应该是一个单独的页面div,您可以通过Ajax加载或包含在HTML中.这是一个例子.
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>Page Title</title>
  5. <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.css" />
  6. <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.2.min.js"></script>
  7. <script type="text/javascript" src="http://code.jquery.com/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.js"></script>
  8. </head>
  9. <body>
  10. <div data-role="page">
  11. <div data-role="header">
  12. <h1>Sample</h1>
  13. </div>
  14. <div data-role="content">
  15. <p></p>
  16. <p><a href="dialog.html" data-rel="dialog" data-role="button">Is this a question?</a></p>
  17. </div>
  18. </div>
  19. <div data-role="page" data-url="dialog.html">
  20. <div data-role="header">
  21. <h1>Dialog</h1>
  22. </div>
  23. <div data-role="content">
  24. <p>Is this an answer?</p>
  25. </div>
  26. </div>
  27. </body>
  28. </html>

猜你在找的jQuery相关文章