comment.html 4.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
  6. <meta content="yes" name="apple-mobile-web-app-capable">
  7. <meta content="black" name="apple-mobile-web-app-status-bar-style">
  8. <meta content="telephone=no" name="format-detection">
  9. <title>首页</title>
  10. <meta name="Keywords" content="" />
  11. <meta name="Description" content="" />
  12. <link href="css/global.css?v=4c79619c" rel="stylesheet"><link href="css/comment.css?v=4c79619c" rel="stylesheet"></head>
  13. <body>
  14. <header>海狸福利社</header>
  15. <section class="comment">
  16. <form action="/" method="POST">
  17. <h2>您参与活动所获得的奖品</h2>
  18. <section class="comment-imgs-box">
  19. <h5>试用产品图片(最多9张)</h5>
  20. <ul>
  21. <li><img src="images/8db3cefb.tmp5.jpg"><input type="hidden" name="imgs[]" value="images/tmp5.jpg"/><em class="close"></em></li>
  22. <li><img src="images/8db3cefb.tmp5.jpg"><input type="hidden" name="imgs[]" value="images/tmp5.jpg"/><em class="close"></em></li>
  23. <li><img src="images/8db3cefb.tmp5.jpg"><input type="hidden" name="imgs[]" value="images/tmp5.jpg"/><em class="close"></em></li>
  24. <li><img src="images/8db3cefb.tmp5.jpg"><input type="hidden" name="imgs[]" value="images/tmp5.jpg"/><em class="close"></em></li>
  25. <li class="fileselect" id="file-upload">
  26. <input type="file" name="file" id="file" accept="image/*">
  27. </li>
  28. </ul>
  29. </section>
  30. <section class="comment-text-box">
  31. <textarea placeholder="输入您的评价(200字内)"></textarea>
  32. </section>
  33. <section class="comment-button-box">
  34. <section class="button-wrapper">
  35. <input class="button" type="submit" name="" value="提交">
  36. </section>
  37. </section>
  38. </form>
  39. </section>
  40. <footer>
  41. <ul>
  42. <li class="active"><a href="#"><i class="icon"><img src="images/98981814.ico-home.png"></i><span>活动</span></a></li>
  43. <li><a href="#"><i class="icon"><img src="images/98981814.ico-home.png"></i><span>奖品</span></a></li>
  44. <li><a href="#"><i class="icon"><img src="images/98981814.ico-home.png"></i><span>招商</span></a></li>
  45. <li><a href="#"><i class="icon"><img src="images/98981814.ico-home.png"></i><span>分享</span></a></li>
  46. </ul>
  47. </footer>
  48. <script type="text/javascript" src="js/global.js?v=4c79619c"></script><script type="text/javascript" src="js/comment.js?v=4c79619c"></script></body>
  49. <script type="text/javascript">
  50. new brickjs.Upload('#file-upload', {
  51. url: '/?c=kindeditor&a=updateJson&dir=image',
  52. params: {
  53. },
  54. size: 2,
  55. limit: 3,
  56. autoUpload: true,
  57. uploadBtn: '.btn-upload',
  58. // tplContainer: '.container',
  59. //autoHide: false,
  60. onUploading: function() {
  61. console.log('onUploading:上传中...');
  62. },
  63. onSuccess: function(response, file) {
  64. if(response.url){
  65. $('.comment-imgs-box ul').prepend(`<li><img src="${response.url}"><input type="hidden" name="imgs[]" value="${response.url}"/><em class="close"></em></li>`)
  66. }
  67. },
  68. onFailure: function(msg, file) {
  69. console.log('onFailure:' + msg, file);
  70. },
  71. onComplete: function(msg, files) {
  72. if (files) { // 部分图片未上传成功
  73. console.log('onComplete:' + msg, files);
  74. } else {
  75. console.log('onComplete:' + msg);
  76. }
  77. },
  78. onDelete: function(file) {
  79. console.log('onDelete:', file);
  80. }
  81. });
  82. </script>
  83. </html>