load-by-requirejs.html 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Load By RequireJS</title>
  6. <link rel="stylesheet" href="demo.css">
  7. </head>
  8. <body>
  9. <form id="form1" class="form">
  10. <div class="form-item">
  11. <input type="text" name="user[email]" data-rule="required;email" placeholder="Email">
  12. </div>
  13. <div class="form-item">
  14. <input type="password" name="password" data-rule="required;" placeholder="Password">
  15. </div>
  16. <div class="form-item">
  17. <button type="submit">Submit</button>
  18. </div>
  19. </form>
  20. <script src="https://cdn.jsdelivr.net/requirejs/2.1.22/require.min.js"></script>
  21. <script>
  22. requirejs.config({
  23. baseUrl: '../',
  24. paths: {
  25. jquery: 'https://cdn.jsdelivr.net/jquery/1.12.3/jquery.min',
  26. validator: 'dist/local/zh-CN'
  27. },
  28. shim: {
  29. validator: ['../dist/jquery.validator.js?css']
  30. }
  31. });
  32. // Way 1: Use plugin methods
  33. require(['jquery', 'validator'], function($){
  34. $('#form1').validator({
  35. timely: 2,
  36. stopOnError: true,
  37. theme: 'yellow_right'
  38. });
  39. });
  40. // Way 2: Just include nice-validator
  41. // require(['validator']);
  42. // Way 3: Define a module dependency nice-validator
  43. // define('some-module', ['jquery', 'validator'], function($){
  44. // // some code
  45. // });
  46. </script>
  47. </body>
  48. </html>