page-break.html 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687
  1. <!DOCTYPE html>
  2. <html lang="zh">
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>Page break - Editor.md examples</title>
  6. <link rel="stylesheet" href="css/style.css" />
  7. <link rel="stylesheet" href="../css/editormd.css" />
  8. <link rel="shortcut icon" href="https://pandao.github.io/editor.md/favicon.ico" type="image/x-icon" />
  9. </head>
  10. <body>
  11. <div id="layout">
  12. <header>
  13. <h1>Page break</h1>
  14. </header>
  15. <div class="btns">
  16. <button id="print-btn">Print Test</button>
  17. <button id="disabled-btn">Disabled</button>
  18. <button id="enabled-btn">Enabled</button>
  19. </div>
  20. <div id="test-editormd">
  21. <textarea style="display:none;">#### Syntax
  22. [At least 8 equals]
  23. [========]
  24. #### Disabled
  25. {
  26. pageBreak : false
  27. }
  28. #### Examples
  29. [========]
  30. > page start
  31. #### Editor.md directory
  32. editor.md/
  33. lib/
  34. css/
  35. scss/
  36. tests/
  37. fonts/
  38. images/
  39. plugins/
  40. examples/
  41. languages/
  42. editormd.js
  43. ...
  44. > page end
  45. </textarea>
  46. </div>
  47. </div>
  48. <script src="js/jquery.min.js"></script>
  49. <script src="../editormd.js"></script>
  50. <script type="text/javascript">
  51. var testEditor;
  52. $(function() {
  53. testEditor = editormd("test-editormd", {
  54. width : "90%",
  55. height : 720,
  56. path : "../lib/"
  57. });
  58. $("#print-btn").click(function(){
  59. var html = testEditor.preview.html();
  60. document.write('<link rel="stylesheet" href="css/style.css" /><link rel="stylesheet" href="../css/editormd.css" />' + html);
  61. window.print();
  62. });
  63. $("#disabled-btn").click(function(){
  64. testEditor.config("pageBreak", false);
  65. });
  66. $("#enabled-btn").click(function(){
  67. testEditor.config("pageBreak", true);
  68. });
  69. });
  70. </script>
  71. </body>
  72. </html>