首先是上传图片，使用的百度webuploader 自己修改后可以实例化多个uploader对象：

HTML：

  1. <!DOCTYPE html>
  2. <html xmlns="http://www.w3.org/1999/xhtml"
  3. 	xmlns:th="http://www.thymeleaf.org">
  4. <head th:include="onload::onloadHead">
  5.  
  6. <title>Works</title>
  7. <!-- 自定义js -->
  8. <style>
  9. /* Additional style to fix warning dialog position */
  10. #alertmod_table_list_2 {
  11. 	top: 900px !important;
  12. }
  13. .lightBoxGallery img {
  14. 	margin-right: 10px;
  15. 	width: 100px;
  16. }
  17. </style>
  18. </head>
  19. <style>
  20. 	.ui-jqgrid-btable tr.jqgrow td {
  21.         overflow: hidden;
  22.         white-space: nowrap;
  23.         text-overflow: ellipsis;
  24.     }
  25.     .ui-jqdialog-content .DataTD {
  26.     padding: 2px;
  27.     border: 0 none;
  28.     vertical-align: middle;
  29. }
  30. #filePicker div:nth-child(2){width:100%!important;height:100%!important;}
  31. </style>
  32.   <link rel="stylesheet" type="text/css" href="/static/js/plugins/webuploader/css/webuploader.css" />
  33.   <link rel="stylesheet" type="text/css" href="/static/js/plugins/webuploader/css/style.css?v=111111" />
  34.   <link rel="stylesheet" type="text/css" href="/static/js/plugins/layer/skin/layer.css?v=111" />
  35.     <link href="/static/css/plugins/iCheck/custom.css" rel="stylesheet">
  36.  
  37. <body class="gray-bg">
  38.  
  39. 	<div class="wrapper wrapper-content animated fadeInRight">
  40. 		<table id="TblGrid_table_list_2" class="EditTable ui-common-table">
  41. 						<tbody>
  42. 							<tr class="FormData">
  43. 								<td class=""><label for="programName" class="search-title">电台栏目：</label></td>
  44. 								<td class="">
  45. 									<div class="col-sm-12">
  46. 										<input id="searchProgramName" name="programName" class="form-control search-input"
  47. 											 placeholder="请输入电台栏目名称" type="text" />
  48.  
  49. 	<button id="searchbtn" onclick="execuesearch()" type="button"
  50. 						 class="btn btn-w-m btn-success">搜索</button>
  51. 											 <button id="searchbtn" onclick="changedialogshow('');" type="button"
  52. 						 class="btn btn-w-m btn-primary">新增</button>
  53.  
  54. 									</div>
  55. 								</td>
  56. 							</tr>
  57. 						</tbody>
  58. 					</table>
  59.  
  60. 		<div class="row">
  61. 			<div class="col-sm-12">
  62. 				<div class="jqGrid_wrapper">
  63. 					<!--3333333333333333  -->
  64. 					<table id="table_list_2">
  65. 						<tbody>
  66. 							<tr>
  67. 								<td colspan="2">
  68. 									<hr class="" style="margin: 1px" />
  69. 								</td>
  70. 							</tr>
  71. 							<tr id="Act_Buttons">
  72. 								<td class="navButton"><a id="pData"
  73. 									class="fm-button btn btn-default" style="display: none;"><span
  74. 										class="glyphicon glyphicon-step-backward"></span></a><a id="nData"
  75. 									class="fm-button btn btn-default" style="display: none;"><span
  76. 										class="glyphicon glyphicon-step-forward"></span></a></td>
  77. 								<td class="EditButton"><a id="changesubmit"
  78. 									class="fm-button btn btn-default fm-button-icon-left">提交<span
  79. 										class="glyphicon glyphicon-save"></span></a><a id="cDataa"
  80. 									class="fm-button btn btn-default fm-button-icon-left"
  81. 									onclick="changedialogdismiss()">取消<span
  82. 										class="glyphicon glyphicon-remove-circle"></span></a></td>
  83. 							</tr>
  84. 						</tbody>
  85. 					</table>
  86. 					<div id="pager_list_2"></div>
  87. 				</div>
  88. 			</div>
  89. 		</div>
  90. 	</div>
  91.  
  92.  
  93. 	<!-- 修改弹窗 查看详情  -->
  94.  
  95. 	<div style="width: 100%">
  96. 				<form name="FormPost" id="changefrom" class="form-horizontal m-t"
  97. 					onsubmit="return false;" style="display: none;">
  98. 					  <div class="ibox-content">
  99.                               <div class="form-group">
  100.                                 <label class="col-sm-3 control-label">图片：</label>
  101.                                 <div class="col-sm-8">
  102.                                    <input type="hidden" name="id" id="dataId" />
  103.                                    <input type="hidden" name="oper" id="oper" />
  104.                                    <input type="hidden" name="image" id="imagedata" required="" />
  105. 							  <div id="moduleGallery" class="editableGallery"></div>
  106.  
  107.                                 </div>
  108.  
  109.                             </div>
  110.                             <div class="form-group">
  111.                                 <label class="col-sm-3 control-label">栏目标题：</label>
  112.                                 <div class="col-sm-8">
  113.                                     <input id="programName" type="input" class="form-control" name="programName" required="" maxlength="30" >
  114.                                 </div>
  115.                             </div>
  116.                             <div class="form-group">
  117.                                 <label class="col-sm-3 control-label">栏目简介：</label>
  118.                                 <div class="col-sm-8">
  119.                                        <textarea id="programIntro" cols="4" rows="10" name="programIntro" class="form-control" required="" aria-required="true" maxlength="200"></textarea>
  120.                                </div>
  121.                             </div>
  122.                             <div class="form-group">
  123.                                 <label class="col-sm-3 control-label">语音：</label>
  124.                                 <div class="col-sm-8 ">
  125.                                      <div class="voicediv">
  126.                                      <audio id="audio" src="" controls="controls" >Your browser does not support the audio element.</audio>
  127.                                      </div>
  128.                                     <input id="voice" type="input" style="display: none;" class="form-control" name="voice" required="" >
  129.                                     <input id="voicetime" type="input" style="display: none;" class="form-control" name="voicetime" required="" >
  130.                                <div id="dropzonediv"></div>      	
  131.  
  132.                                </div>
  133.                             </div>
  134.                             <div class="form-group">
  135.                                 <label class="col-sm-3 control-label">主持人：</label>
  136.                                 <div class="col-sm-8">
  137.                                     <input id="compere" type="input" class="form-control" name="compere" required=""  aria-required="true" maxlength="10" >
  138.                                 </div>
  139.                             </div>
  140.                               <div class="form-group IdDis">
  141.                                 <label class="col-sm-3 control-label">评论量：</label>
  142.                                 <div class="col-sm-8">
  143.                                     <input id="commentNumber" type="input" class="form-control" name="commentNumber" disabled="disabled"  required="" aria-required="true" digits="true">
  144.                                 </div>
  145.                             </div>
  146.                               <div class="form-group IdDis">
  147.                                 <label class="col-sm-3 control-label">浏览量：</label>
  148.                                 <div class="col-sm-8">
  149.                                     <input id="pageView" type="input" class="form-control" name="pageView" required="" disabled="disabled" aria-required="true" digits="true" >
  150.                                 </div>
  151.                             </div>
  152.                               <div class="form-group">
  153.                                 <label class="col-sm-3 control-label">是否置顶：</label>
  154.                                 <div class="col-sm-8">
  155.                                 <div class="radio i-checks">
  156.                                         <label>
  157.                                             <input type="radio" checked="checked" value="1" attri="置顶" name="isTop" class="isTop" > <i></i> 置顶</label>
  158.                                     </div>
  159.                                  <div class="radio i-checks">
  160.                                         <label>
  161.                                             <input type="radio" value="0" name="isTop" attri="未置顶"  class="isTop" > <i></i> 未置顶</label>
  162.                                     </div>
  163.  
  164.                                 </div>
  165.                             </div>
  166.                     </div>
  167. 				</form>
  168. 		</div>
  169.  
  170. 			<!-- 评论 -->
  171. 			        <div class="social-feed-box" id="commentBox" style="display: none;">
  172.                     </div>
  173.  
  174. 		<!-- 	</div>
  175. 		</div>
  176. 	</div> -->
  177.  
  178. 	<div th:replace="onload::onloadJS"></div>
  179.  
  180. 	<div th:replace="onload::onloadFresh"></div>
  181.     <script src="/static/js/plugins/iCheck/icheck.min.js"></script>
  182.  <script type="text/javascript" src="/static/js/plugins/webuploader/js/webuploader.js?v=211111111"></script>
  183.  <script type="text/javascript" src="/static/js/lin/fm/upload.js?v=111111111111111"></script>
  184.        <script type="text/javascript">
  185.        //单选按钮
  186.        $(document).ready(function(){$(".i-checks").iCheck({checkboxClass:"icheckbox_square-green",radioClass:"iradio_square-green",})});
  187.  
  188.        	</script>
  189. 	<script th:src="@{static/js/lin/fm/fm_radio_program.js?a=111111111}"></script>
  190. 	<script th:src="@{static/js/plugins/layer/layer.min.js?a=1}"></script>
  191. </body>
  192. </html>

onload.html

  1. <!DOCTYPE html>
  2. <html xmlns="http://www.w3.org/1999/xhtml"
  3.     xmlns:th="http://www.thymeleaf.org">
  4. <head th:fragment="onloadHead">
  5. <meta charset="utf-8" />
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  7. <meta name="renderer" content="webkit" />
  8. <meta name="keywords" content="爱燕子" />
  9. <meta name="description" content="爱燕子" />
  10.  
  11. <!-- <link rel="shortcut icon" type="image/x-icon"  th:href="@{/static/css/favicon.ico}" /> -->
  12.     <!-- jqgrid-->
  13.  
  14. <link href="/static/js/plugins/fancybox/jquery.fancybox.css"
  15.     rel="stylesheet" />
  16.  
  17. <link href="/static/css/plugins/blueimp/css/blueimp-gallery.min.css" rel="stylesheet"/>
  18. <!-- <link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet"/>
  19. <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css"/> -->
  20.  
  21. <link href="/static/css/plugins/jqgrid/ui.jqgrid.css?0820" rel="stylesheet"/>
  22. <link th:href="@{/static/css/jquery-ui.css}" rel="stylesheet"/>
  23. <link href="/static/css/plugins/sweetalert/sweetalert.css" rel="stylesheet"/>
  24. <!-- Morris -->
  25. <link href="/static/css/plugins/morris/morris-0.4.3.min.css" rel="stylesheet" />
  26. <!-- Gritter -->
  27. <link href="/static/js/plugins/gritter/jquery.gritter.css" rel="stylesheet" />
  28. <link href="/static/css/bootstrap.min.css?v=3.3.6" rel="stylesheet"/>
  29. <link href="/static/css/font-awesome.css?v=4.4.01" rel="stylesheet"/>
  30.  <!-- jqgrid-->
  31. <link href="/static/css/plugins/jqgrid/ui.jqgrid.css?0820" rel="stylesheet"/>
  32.  
  33. <link href="/static/css/animate.css" rel="stylesheet"/>
  34. <link href="/static/css/style.css?v=4.1.0" rel="stylesheet"/>
  35. <link rel="stylesheet" type="text/css" th:href="@{/static/css/lin/easyui.css}" />
  36. <link href="/static/css/plugins/toastr/toastr.min.css" rel="stylesheet" />
  37. <link href="/static/css/common.css" rel="stylesheet" />
  38. <link rel="stylesheet" type="text/css" href="http://cdn.bootcss.com/bootstrap-select/2.0.0-beta1/css/bootstrap-select.css"/>
  39. <link href="/static/css/plugins/dropzone/basic.css" rel="stylesheet">
  40. <link href="/static/css/plugins/dropzone/dropzone.css?v=11" rel="stylesheet">
  41.  
  42. </head>
  43.  
  44.   <div th:fragment="froalaCss">
  45.   <link rel="stylesheet" type="text/css" href="/static/js/plugins/webuploader/css/webuploader.css" />
  46.   <link rel="stylesheet" type="text/css" href="/static/js/plugins/webuploader/css/style.css" />
  47.   <link rel="stylesheet" href="/static/froala/css/froala_editor.css"/>
  48.   <link rel="stylesheet" href="/static/froala/css/froala_style.css"/>
  49.   <link rel="stylesheet" href="/static/froala/css/plugins/code_view.css"/>
  50.   <link rel="stylesheet" href="/static/froala/css/plugins/draggable.css"/>
  51.   <link rel="stylesheet" href="/static/froala/css/plugins/colors.css"/>
  52.   <link rel="stylesheet" href="/static/froala/css/plugins/emoticons.css"/>
  53.   <link rel="stylesheet" href="/static/froala/css/plugins/image_manager.css"/>
  54.   <link rel="stylesheet" href="/static/froala/css/plugins/image.css"/>
  55.   <link rel="stylesheet" href="/static/froala/css/plugins/line_breaker.css"/>
  56.   <link rel="stylesheet" href="/static/froala/css/plugins/table.css"/>
  57.   <link rel="stylesheet" href="/static/froala/css/plugins/char_counter.css"/>
  58.   <link rel="stylesheet" href="/static/froala/css/plugins/video.css"/>
  59.   <link rel="stylesheet" href="/static/froala/css/plugins/fullscreen.css"/>
  60.   <link rel="stylesheet" href="/static/froala/css/plugins/file.css"/>
  61.   <link rel="stylesheet" href="/static/froala/css/plugins/quick_insert.css"/>
  62.   <link rel="stylesheet" href="/static/froala/css/plugins/help.css"/>
  63.   <link rel="stylesheet" href="/static/froala/css/third_party/spell_checker.css"/>
  64.   <link rel="stylesheet" href="/static/froala/css/plugins/special_characters.css"/>
  65.   <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.css"/>
  66.  
  67. </div>
  68.  
  69. <body>
  70.  
  71. <div th:fragment="onloadJS">
  72.     <!-- 全局js -->
  73.  
  74.     <script src="/static/js/jquery.min.js?v=2.1.4"></script>
  75.     <script src="/static/js/bootstrap.min.js?v=3.3.6"></script>
  76.     <script type="text/javascript" src="http://cdn.bootcss.com/bootstrap-select/2.0.0-beta1/js/bootstrap-select.js"></script>   
  77.  
  78.     <script src="/static/js/plugins/metisMenu/jquery.metisMenu.js"></script>
  79.     <script src="/static/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
  80.     <script src="/static/js/plugins/layer/layer.min.js"></script>
  81.     <script th:src="@{/static/js/lin/index.js}"></script>
  82.     <!-- 自定义js -->
  83.     <script src="/static/js/hplus.min.js?v=4.1.0"></script>
  84.     <!--<script type="text/javascript" src="js/contabs.js?v=2"></script>-->
  85.     <script type="text/javascript" src="/static/js/contabs.min.js"></script>
  86.     <!-- 第三方插件 -->
  87.     <script src="/static/js/plugins/pace/pace.min.js"></script>
  88.     <script src="/static/js/plugins/peity/jquery.peity.min.js"></script>
  89.     <script src="/static/js/demo/peity-demo.min.js"></script>
  90.     <script src="/static/js/content.min.js"></script>
  91.     <script src="/static/js/plugins/jquery-ui/jquery-ui.min.js"></script>
  92.     <script src="/static/js/plugins/gritter/jquery.gritter.min.js"></script>
  93.     <script src="/static/js/plugins/easypiechart/jquery.easypiechart.js"></script>
  94.     <script src="/static/js/plugins/sparkline/jquery.sparkline.min.js"></script>
  95.     <script src="/static/js/demo/sparkline-demo.min.js"></script>
  96.       <!-- jqGrid -->
  97.     <script src="/static/js/plugins/jqgrid/i18n/grid.locale-cn.js?0820"></script>
  98.     <script src="/static/js/plugins/jqgrid/jquery.jqGrid.min.js?0820"></script>
  99.     <script src="/static/js/jquery-ui-1.10.4.min.js"></script>
  100.     <script src="/static/js/jquery-ui.custom.min.js"></script>
  101.     <!-- 封装过的Sweet alert js -->
  102.     <script th:src="@{/static/js/lin/dialog.js}"></script>
  103.     <!-- Sweet alert -->
  104.     <script src="/static/js/plugins/sweetalert/sweetalert.min.js"></script>
  105.     <!-- Toastr script -->
  106.     <script src="/static/js/plugins/toastr/toastr.min.js"></script>
  107.     <!-- laydate -->
  108.     <script src="/static/js/plugins/layer/laydate/laydate.js"></script>
  109.  
  110.     <script th:src="@{/static/js/plugins/fancybox/jquery.fancybox.js}"></script>
  111.     <script src="/static/js/plugins/blueimp/jquery.blueimp-gallery.min.js"></script>
  112.  
  113.     <script src="/static/js/plugins/switchery/switchery.js"></script>
  114.  
  115.       <script src="/static/js/plugins/validate/jquery.validate.min.js"></script>
  116.     <script src="/static/js/plugins/validate/messages_zh.min.js"></script>
  117.     <script src="/static/js/demo/form-validate-demo.min.js"></script>
  118.  
  119.     <!--  -->
  120.  
  121.     <script src="/static/js/plugins/dropzone/dropzone.js"></script>
  122.  
  123.  <div class="lightBoxGallery">
  124.     <div id="blueimp-gallery" class="blueimp-gallery">
  125.                                 <div class="slides"></div>
  126.                                 <h3 class="title"></h3>
  127.                                 <a class="prev">‹</a>
  128.                                 <a class="next">›</a>
  129.                                 <a class="close">×</a>
  130.                                 <a class="play-pause"></a>
  131.                                 <ol class="indicator"></ol>
  132.                             </div>
  133.                         </div>
  134. </div>
  135.  
  136. <div th:fragment="froalaJS">
  137.     <!-- froala editor js -->
  138.  
  139.   <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/codemirror.min.js"></script>
  140.   <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.3.0/mode/xml/xml.min.js"></script>
  141.  
  142.   <script type="text/javascript" src="/static/froala/js/froala_editor.min.js" ></script>
  143.   <script type="text/javascript" src="/static/froala/js/plugins/align.min.js"></script>
  144.   <script type="text/javascript" src="/static/froala/js/plugins/char_counter.min.js"></script>
  145.   <script type="text/javascript" src="/static/froala/js/plugins/code_beautifier.min.js"></script>
  146.   <script type="text/javascript" src="/static/froala/js/plugins/code_view.min.js"></script>
  147.   <script type="text/javascript" src="/static/froala/js/plugins/colors.min.js"></script>
  148.   <script type="text/javascript" src="/static/froala/js/plugins/draggable.min.js"></script>
  149.   <script type="text/javascript" src="/static/froala/js/plugins/emoticons.min.js"></script>
  150.   <script type="text/javascript" src="/static/froala/js/plugins/entities.min.js"></script>
  151.   <script type="text/javascript" src="/static/froala/js/plugins/file.min.js"></script>
  152.   <script type="text/javascript" src="/static/froala/js/plugins/font_size.min.js"></script>
  153.   <script type="text/javascript" src="/static/froala/js/plugins/font_family.min.js"></script>
  154.   <script type="text/javascript" src="/static/froala/js/plugins/fullscreen.min.js"></script>
  155.   <script type="text/javascript" src="/static/froala/js/plugins/image.min.js"></script>
  156.   <script type="text/javascript" src="/static/froala/js/plugins/image_manager.min.js"></script>
  157.   <script type="text/javascript" src="/static/froala/js/plugins/line_breaker.min.js"></script>
  158.   <script type="text/javascript" src="/static/froala/js/plugins/inline_style.min.js"></script>
  159.   <script type="text/javascript" src="/static/froala/js/plugins/link.min.js"></script>
  160.   <script type="text/javascript" src="/static/froala/js/plugins/lists.min.js"></script>
  161.   <script type="text/javascript" src="/static/froala/js/plugins/paragraph_format.min.js"></script>
  162.   <script type="text/javascript" src="/static/froala/js/plugins/paragraph_style.min.js"></script>
  163.   <script type="text/javascript" src="/static/froala/js/plugins/quick_insert.min.js"></script>
  164.   <script type="text/javascript" src="/static/froala/js/plugins/quote.min.js"></script>
  165.   <script type="text/javascript" src="/static/froala/js/plugins/table.min.js"></script>
  166.   <script type="text/javascript" src="/static/froala/js/plugins/save.min.js"></script>
  167.   <script type="text/javascript" src="/static/froala/js/plugins/url.min.js"></script>
  168.   <script type="text/javascript" src="/static/froala/js/plugins/video.min.js"></script>
  169.   <script type="text/javascript" src="/static/froala/js/plugins/help.min.js"></script>
  170.   <script type="text/javascript" src="/static/froala/js/plugins/print.min.js"></script>
  171.   <script type="text/javascript" src="/static/froala/js/third_party/spell_checker.min.js"></script>
  172.   <script type="text/javascript" src="/static/froala/js/plugins/special_characters.min.js"></script>
  173.   <script type="text/javascript" src="/static/froala/js/plugins/word_paste.min.js"></script>
  174.   <script type="text/javascript" src="/static/froala/js/languages/zh_cn.js"></script>
  175. </div>
  176. <div th:fragment="webuploaderjs">
  177.      <!--webuploader  -->
  178.  <script type="text/javascript" src="/static/js/plugins/webuploader/js/webuploader.js"></script>
  179.  <script type="text/javascript" src="/static/js/plugins/webuploader/js/upload.js"></script>
  180.  
  181. </div>
  182. <div th:fragment="onloadFresh">
  183.  
  184. <script type="text/javascript">
  185. var check=function(e){
  186.  
  187.     e=e||window.event; //alert(e.which||e.keyCode);
  188.     if((e.which||e.keyCode)==){
  189.         if(e.preventDefault){
  190.             e.preventDefault();
  191.  
  192.             window.location.reload();
  193.         } else{
  194.             event.keyCode = ;
  195.             e.returnValue=false;
  196.             window.location.reload();
  197.         }
  198.     }
  199. }
  200.  
  201. if(document.addEventListener){
  202. document.addEventListener("keydown",check,false);
  203. } else{
  204. document.attachEvent("onkeydown",check);
  205. }
  206. </script> 
  207.  
  208.     <script>
  209.         $(document).ready(function() {
  210.             $(".fancybox").fancybox({
  211.                 openEffect : "none",
  212.                 closeEffect : "none"
  213.             })
  214.         });
  215.     </script>
  216. </div>
  217. </body>
  218. </html>

js:

  1.  
  1.  
  1.  

$(function() {
$.jgrid.defaults.styleUI = 'Bootstrap';
buildgrid();
});
function changedialogdismiss(){
$("#changedialog").hide(speed="slow");
}

  1.  

function execuesearch(){
$("#table_list_2").setGridParam( //G,P要大写
{
url:"/fmRadioProgram/list",
postData:{"programName":$("#searchProgramName").val()}
}
).trigger("reloadGrid");
$("#showsearchparam").hide(speed="slow");
};

  1.  

function showsearch(){
$('#showsearchparam').bind('keyup', function(event) {
if (event.keyCode == "13") {
//回车执行查询
$('#execuesearch').trigger("click");
}
});
$("#showsearchparam").show(speed="slow");

}
function updateSetting(id,param,handle){

  1.  

var jsondata = {"id" : id,"oper":"edit",};
if(param==1){
jsondata.isTop = handle;
}else{
return ;
}
$.ajax({
url: "/fmRadioProgram/operation",
type: "POST",
data: jsondata,
success: function(data , stutas){

  1.  

if(data.code == "200"){
$("#table_list_2").trigger("reloadGrid");
if(param==1){
handle==1?successalert("" , "设置置顶成功"):successalert("" , "取消置顶成功");
}
}else{
errorsalert("" , "操作失败");
}
},
error: function(){
errorsalert("" , "出现错误，请重试");
}
});
}
function deleteById(id) {
deletealert("" , "确定要删除此栏目吗？" , function(){doDelete(id)});
}
function doDelete(id){

var jsondata = {"id" : id,"oper":"del",};
$.ajax({
url: "/fmRadioProgram/operation",
type: "POST",
data: jsondata,
success: function(data , stutas){

if(data.code == "200"){
$("#table_list_2").trigger("reloadGrid");

successalert("" , "删除成功");

}else{
errorsalert("" , "操作失败");
}
},
error: function(){
errorsalert("" , "出现错误，请重试");
}
});
}

  1.  

function initdropzone(){
var str =' <div id="dropzone" class="dropzone" >'+
'<button type="submit" class="btn btn-primary pull-right" style="display:none;">提交</button>'+

' </div>';
$("#dropzonediv").html(str);
$("#dropzone").dropzone({
url: "/uploadVideoToFast",//上传文件的地址，
autoProcessQueue:false,
maxFiles: 1,//最多上传几个图片
maxFilesize: 10,//图片的大小，单位是M
addRemoveLinks:true,//是否有删除图片的功能
dictRemoveFile:"移除",//删除图片的文字
dictMaxFilesExceeded: "您最多只能上传1个文件！",
dictResponseError: '文件上传失败!',
dictInvalidFileType: "你不能上传该类型文件,文件类型只能是*.mp3。",
dictFallbackMessage:"浏览器不受支持",
dictDefaultMessage: "拖入需要上传的文件",
dictFileTooBig:"文件过大上传文件最大支持(10M).",
acceptedFiles: ".mp3",//支持的格式
paramName:'file',//上传的FILE名称，即服务端可以通过此来获取上传的图片，如$_FILES['dropimage']
init: function() {//初始化是的事件
var myDropzone = this;
this.element.querySelector("button[type=submit]")
.addEventListener("click", function(e) {
layer.load(3, {
shade: [0.1,'#fff'] //0.1透明度的白色背景
});
e.preventDefault();
e.stopPropagation();
myDropzone.processQueue();
});
this.on("success", function(file,response) {
$("#voice").val(response.playUrl);
$("#voicetime").val(response.length);
layer.closeAll('loading');
successalert("","上传成功");
$("#audio").attr("src",response.playUrl);
$(".voicediv").show();
});

this.on("addedfile", function(file) {
$("button[type=submit]").show();

});

this.on("removedfile", function(file) {
$("#voice").val("");
$("#voicetime").val("");
$("button[type=submit]").hide();
$(".voicediv").hide();
});
}
});
}
function changedialogshow(id){
initdropzone();
var wuploader;
var urlArray = [];//全局url变量
var a = '#uploader';
var p ='#filePicker';
var o = '#filePicker2';
var u = 'uploadFileToFast';
var drawcontent = '#moduleGallery';
var imagedata = "#imagedata";

// 初始化上传插件
$("#uploader").show();
$("#dataId").val("");
$('#moduleGallery').html("");
urlArray.splice(0,urlArray.length);
$("#pageView").val("");
$("#commentNumber").val("");
$("#voice").val("");
$("#imagedata").val("");
$("#compere").val("");
$("#programIntro").val("");
$("#programName").val("");
if(id!=""){
var datas = $("#table_list_2").jqGrid("getRowData",id);
$("#dataId").val(datas.ID);
$('.isTop').each(function (index, ele) {
if( $(ele).attr("attri")==datas.isTop){
$(ele).attr("checked","checked");
}

});
$(".i-checks").iCheck({checkboxClass:"icheckbox_square-green",radioClass:"iradio_square-green",})
$("#pageView").val(datas.pageView);
$("#commentNumber").val(datas.commentNumber);
$("#voice").val(datas.voice);
$("#voicetime").val(datas.voicetime);

if(datas.voice!=""){
$("#audio").attr("src",datas.voice);
$(".voicediv").show();
}else{
$(".voicediv").hide();
}
$("#imagedata").val($("#"+id+"image").attr("href"));
$("#compere").val(datas.compere);
$("#programIntro").val(datas.programIntro);
$("#programName").val(datas.programName);
$('#moduleGallery').html("");
// 现有图片
if($("#"+id+"image").attr("href").indexOf("bg.png")==-1){ //有图片 不能上传
urlArray.push($("#"+id+"image").attr("href"));

  1.  

wuploader = initWebUploaderUI(a, p,o,u,0,wuploader,urlArray,drawcontent,imagedata);
$(a).hide();
}else{

wuploader = initWebUploaderUI(a, p,o,u,1,wuploader,urlArray,drawcontent,imagedata);
}
$(".IdDis").show();
}else{
$(".IdDis").hide();
$(".voicediv").hide();
wuploader = initWebUploaderUI(a, p,o,u,1,wuploader,urlArray,drawcontent,imagedata);
}

  1.  

var title = "修改";
if(id==""){
title="新增";
}
layer.open({
type: 1,
shade: true,
title: title, //不显示标题
skin: 'layui-layer-rim', //加上边框
area: ['1400px', '800px'], //宽高
closeBtn: 1, //不显示关闭按钮
btn: ['保存', '取消'],
zIndex:1000, //层优先级
yes: function(index){
if($("#dataId").val()==""){
$("#oper").val("add");
}else{
$("#oper").val("edit");
}

if(!$("#changefrom").valid()){
return;
}
if($("#imagedata").val()==""){
errorsalert("","请选择一张封面图");
return ;
}
if($("#voice").val()==""){
errorsalert("","请上传语音");
return ;
}
$.ajax({
url: "/fmRadioProgram/operation",
type: "POST",
data: $("#changefrom").serialize(),
dataType:"json",
success: function(data , stutas){

  1.  

if(data.code == "200"){
$("#table_list_2").trigger("reloadGrid");
if($("#dataId").val()==""){
successalert("" , "新增成功");
}else{
successalert("" , "修改成功");
}

}else{
errorsalert("" , "操作失败");
}
},
error: function(){
errorsalert("" , "出现错误，请重试");
}
});
layer.close(index);

},
cancel: function(){
},
content: $('#changefrom') //捕获的元素，注意：最好该指定的元素要存放在body最外层，否则可能被其它的相对元素所影响

});

  1.  

}

  1.  

function buildgrid() {
$("#table_list_2").jqGrid(
{
url : "/fmRadioProgram/list",
datatype : "json",
mtype : "POST",
height : "100%",
autowidth : true,
rownumbers : true,
jsonReader : {
root : "data.list",
page : "data.pageNum",
total : "data.pages", // 很重要 定义了 后台分页参数的名字。
records : "data.total"
},
rowNum : 5,
 ondblClickRow:function(rowid,iRow,iCol,e){
changedialogshow(rowid);
},
rowList : [ 5,10, 20, 30 ],
colNames : [ 'id',
'栏目标题',
'栏目简介',
'主持人',
'图片',
'语音',
'评论数量',
'浏览量',
'是否置顶',
'创建时间',
'操作' ],
colModel : [
{
name : 'ID',
index : 'ID',
editable : true,
hidden : true,
},
{
name : 'programName',
index : 'program_name',
editable : true,
},
{
name : 'programIntro',
index : 'program_intro',
editable : true,
width:300,
},
{
name : 'compere',
index : 'compere',
editable : true,
},
{
name : 'image',
index : 'image',
editable : true,
},
{
name : 'voice',
index : 'voice',
editable : true,
hidden:true,
},
{
name : 'commentNumber',
index : 'comment_number',
editable : true,
},
{
name : 'pageView',
index : 'page_view',
editable : true,
},
{
name : 'isTop',
index : 'is_top',
editable : true,
},
{
name : 'createTime',
index : 'create_time',
editable : true,
width:200,
},
{
name : 'handle',
index : 'handle',
width : 470,
sortable : false
}
],
pager : "#pager_list_2",
viewrecords : true,
editurl : "/fmRadioProgram/operation",
hidegrid : false,
gridComplete : function() {
var ids = $("#table_list_2").jqGrid("getDataIDs");
var bodys = $("#table_list_2").jqGrid("getRowData");
for (var int = 0; int < ids.length; int++) {

var id = ids[int];
var ck = "<a href='#' class='btn btn-xs btn-primary' onclick='showComment(" + bodys[int].ID + ","+1+","+10+","+1+","+1+")'>查看评论</a>"; //这里的onclick就是调用了上面的javascript函数 Modify(id)
var edit = "<a href='#' class='btn btn-xs btn-primary' onclick='changedialogshow(" + id + ")'>编辑</a>"; //这里的onclick就是调用了上面的javascript函数 Modify(id)
var del = "<a href='#' class='btn btn-xs btn-warning' onclick='deleteById(" + id + ")'>删除</a>"; //这里的onclick就是调用了上面的javascript函数 Modify(id)

var tj= bodys[int].isTop== 0 ? "<a href='#' class='btn btn-xs btn-primary' onclick='updateSetting(" + bodys[int].ID + ","+1+","+1+")' >设为置顶</a>" : "<a href='#' class='btn btn-xs btn-danger' onclick='updateSetting(" + bodys[int].ID + ","+1+","+0+")' >取消置顶</a>";

var result = $("#table_list_2").jqGrid("setRowData", id, {
handle : ck + " "+edit+" "+tj+" "+del
});
var image = "";
var title;
if(bodys[int].image==""){
image = "/static/js/plugins/webuploader/img/bg.png";
title = "404";
}else{

title = "图片";
image = bodys[int].image;
}
var result1 = $("#table_list_2").jqGrid("setRowData", id, {

image : '<a href="'+image+'" id="'+id+'image" title="'+title+'" data-gallery="" ><img src="'+image+'" width="100" height="100" ></img></a>'

});
var result3 = $("#table_list_2").jqGrid("setRowData", id, {
"isTop" : bodys[int].isTop==1?"置顶":"未置顶"
});

}

}
});

  1.  
  1.  

// Setup buttons
$("#table_list_2").jqGrid('navGrid', '#pager_list_2', {
edit : false,
add : false,
del : false,
search : false
}, {
height : 300,
reloadAfterSubmit : true
});

  1.  

$(window).bind('resize', function() {
var width = $('.jqGrid_wrapper').width();
$('#table_list_2').setGridWidth(width);
});

  1.  

}

  1.  
  1.  

function showComment(id,page,rows,ClearContent,isOpenLayer){

  1.  

$(".jiazaigengduo").remove();
if(ClearContent=="1"){

$("#commentBox").html("");
}
layer.load(3, {
shade: [0.1,'#fff'] //0.1透明度的白色背景
});
$.ajax({
url: "/fmComment/commentList?page="+page+"&rows="+rows+"&radioId="+id,
type: "GET",
dataType:"json",
success: function(data , stutas){

  1.  

page++;
var emptyPhoto='/static/js/plugins/webuploader/img/bg.png';
var str = "";
if(data.code == "200"){
for(var i = 0;i<data.data.commentList.list.length;i++){
var _this = data.data.commentList.list[i];
str+=
'<div class="social-avatar">';
if(_this.ayzUser){
if(_this.ayzUser.headphoto!=''&&_this.ayzUser.headphoto!=null){
str+='<a href="javascript:void(0);" class="pull-left">'+
' <img alt="image" src="'+_this.ayzUser.headphoto+'">'+
'</a>';
}else{
str+='<a href="javascript:void(0);" class="pull-left">'+
' <img alt="image" src="'+emptyPhoto+'">'+
'</a>';
}

};
str+='<div class="media-body">';
if(_this.ayzUser){
if(_this.ayzUser.username){
str+=' <a href="javascript:void(0);">'+_this.ayzUser.username+" "+'<span style="color:red;">'+_this.ayzUser.phone+"</span>";
if(_this.ayzUser.certificationTitle){
str+= ' <label class="btn btn-xs btn-warning">'+_this.ayzUser.certificationTitle+'</label>';

}
str+=' </a>';
}

}

str+=' <small class="text-muted">'+_this.createTime+' 来自 客户端</small>'+
' </div>'+
'</div>'+
' <div class="ibox-content">';

  1.  

if(_this.image!=""&&_this.image!=null){
for(var j = 0;j<_this.image.split("|").length;j++){

str+= ' <a class="fancybox" href="'+_this.image.split("|")[j]+'" title="图片">'+
' <img alt="image" height="400px" src="'+_this.image.split("|")[j]+'" />'+
' </a>';
}

}

str+=_this.content+' </div>'+
' </div>'+
' <div class="social-footer">';

for(var k = 0;k<_this.childList.length;k++){
var _child = _this.childList[k];

str+=' <div class="social-comment"><div class="media-body">';
if(_child.ayzUser){
if(_child.ayzUser.headphoto!=""&&_child.ayzUser.headphoto!=null){
str+= '<a href="javascript:void(0);" class="pull-left">'+
' <img alt="image" src="'+_child.ayzUser.headphoto+'">'+
' </a>';
}else{
str+= '<a href="javascript:void(0);" class="pull-left">'+
' <img alt="image" src="'+emptyPhoto+'">'+
' </a>';
}
str+=' <a href="#">'+_child.ayzUser.username;
if(_child.ayzUser.certificationTitle){
str+= ' <label class="btn btn-xs btn-warning">'+_child.ayzUser.certificationTitle+'</label>';

}
str+= ' </a>';
if(_child.isReply==1){
if(_child.ayzBeUser){
if(_child.ayzBeUser.username){
str+='回复 <a href="#">'+_child.ayzBeUser.username;
if(_child.ayzBeUser.certificationTitle){
str+= ' <label class="btn btn-xs btn-warning">'+_child.ayzBeUser.certificationTitle+'</label>';

}
str+= ' </a>';
}else{
str+='回复 <a href="#" style="color:red;" >未知用户</a>';
}
}else{
str+='回复 <a href="#" style="color:red;" >未知用户</a>';
}

  1.  

}
}

str+= _child.content+
' <br/>'+
' <a href="javascript:void(0);" class="small"><i class="fa fa-thumbs-up"></i> '+_child.praiseNumber+'</a> -'+
' <small class="text-muted">'+_child.createTime+'</small>'+
' </div></div>';
}
str+= '</div></div>';

}

if(str==''){
str+='<div class="social-footer" style="text-align:center;"><a href="#" style="margin:0 auto;" class="btn btn-xs btn-info disabled" >暂无评论</a></div>';

}else{
if(page<data.data.commentList.pages){

str+='<div class="social-footer jiazaigengduo" style="text-align:center;"><a href="#" style="margin:0 auto;" class="btn btn-xs btn-primary" onclick=showComment("'+id+'","'+page+'","'+rows+'","0","0");>加载更多</a></div>';
}else{
str+='<div class="social-footer" style="text-align:center;"><a href="#" style="margin:0 auto;" class="btn btn-xs btn-info disabled" onclick=showComment("'+id+'","'+page+'","'+rows+'","0","0");>没有更多评论了...</a></div>';

}
}
$("#commentBox").append(str);
layer.closeAll('loading');
}else{
errorsalert("" , "操作失败");
layer.closeAll('loading');
}
},
error: function(){
errorsalert("" , "出现错误，请重试");
layer.closeAll('loading');
}
});
if(isOpenLayer=="1"){
layer.open({
type: 1,
shade: true,
title: "查看评论", //不显示标题
skin: 'layui-layer-rim', //加上边框
area: ['1400px', '800px'], //宽高
closeBtn: 1, //不显示关闭按钮
btn: ['确定'],
zIndex:1000, //层优先级
yes: function(index){

layer.close(index);

},
cancel: function(){
},
content: $('#commentBox') //捕获的元素，注意：最好该指定的元素要存放在body最外层，否则可能被其它的相对元素所影响

});
}

  1.  

}

  1.  

controller:

  1. package com.sm.ayz.springcloud.controller.file;
  2.  
  3. import java.io.File;
  4. import java.io.FileNotFoundException;
  5. import java.io.FileOutputStream;
  6. import java.io.IOException;
  7. import java.io.InputStream;
  8. import java.io.OutputStream;
  9. import java.text.SimpleDateFormat;
  10. import java.util.Date;
  11. import java.util.Map;
  12.  
  13. import org.springframework.beans.factory.annotation.Autowired;
  14. import org.springframework.stereotype.Controller;
  15. import org.springframework.util.FileCopyUtils;
  16. import org.springframework.web.bind.annotation.RequestMapping;
  17. import org.springframework.web.bind.annotation.RequestParam;
  18. import org.springframework.web.bind.annotation.ResponseBody;
  19. import org.springframework.web.multipart.MultipartFile;
  20.  
  21. import com.sm.ayz.springcloud.bean.CommonResult;
  22. import com.sm.ayz.springcloud.bean.setting.Poster;
  23. import com.sm.ayz.springcloud.common.alivod.vodUpload.UploadVideoDemo;
  24. import com.sm.ayz.springcloud.service.setting.PosterClientService;
  25.  
  26. import it.sauronsoftware.jave.Encoder;
  27. import it.sauronsoftware.jave.MultimediaInfo;
  28.  
  29. @Controller
  30. public class FileController {
  31.  
  32.     @Autowired
  33.     private PosterClientService service;
  34.     // 账号AK信息请填写(必选)
  35.     public static final String accessKeyId = "LTAIawOwQHZrGDYi";
  36.     // 账号AK信息请填写(必选)
  37.     public static final String accessKeySecret = "FjiN6LcS5ABLGJk91lBUi87DUwgLYM";
  38.     /*
  39.      * @Autowired private CommonFileUtil fileUtil;
  40.      */
  41.  
  42.     @RequestMapping("/goIndex")
  43.     public String goIndex() {
  44.         // logger.info("进入主页面");
  45.         return "/file";
  46.     }
  47.  
  48.     @RequestMapping("/fileUpload")
  49.     public String fileUpload(@RequestParam("fileName") MultipartFile file) {
  50.  
  51.         String targetFilePath = "E:/opt/uploads/";
  52.  
  53.         if (file.isEmpty()) {
  54.             // logger.info("this file is empty");
  55.         }
  56.  
  57.         String newFileName = new SimpleDateFormat("yyyyMMddHHmmssSSS").format(new Date());
  58.         // 获取原来文件名称
  59.         String fileSuffix = file.getOriginalFilename().substring(file.getOriginalFilename().lastIndexOf("."));
  60.  
  61.         if (!fileSuffix.equals(".jpg") || !fileSuffix.equals(".png")) {
  62.             // logger.info("文件格式不正确");
  63.         }
  64.         // 拼装新的文件名
  65.         String targetFileName = targetFilePath + newFileName + fileSuffix;
  66.         // 上传文件
  67.         try {
  68.             FileCopyUtils.copy(file.getInputStream(), new FileOutputStream(targetFileName));
  69.         } catch (FileNotFoundException e) {
  70.             e.printStackTrace();
  71.         } catch (IOException e) {
  72.             e.printStackTrace();
  73.         }
  74.  
  75.         return "/success";
  76.     }
  77.  
  78.     // 使用fastdfs进行文件上传
  79.     @RequestMapping("/uploadFileToFast")
  80.     @ResponseBody
  81.     public String uoloadFileToFast(@RequestParam("file") MultipartFile file) throws IOException, InterruptedException {
  82.         UploadVideoDemo u = new UploadVideoDemo();
  83.         String url = u.testUploadImageLocalFile(accessKeyId, accessKeySecret, file);
  84.         return url;
  85.     }
  86.  
  87.     // 使用fastdfs进行文件上传
  88.     /**
  89.      * 上传海报图片
  90.      *
  91.      * @param file
  92.      * @return
  93.      * @throws IOException
  94.      * @throws InterruptedException
  95.      * @author ffwwzz
  96.      */
  97.     @RequestMapping("/uploadHaiBao")
  98.     @ResponseBody
  99.     public String uploadHaiBao(@RequestParam("file") MultipartFile file) throws IOException, InterruptedException {
  100.         UploadVideoDemo u = new UploadVideoDemo();
  101.         String url = u.testUploadImageLocalFile(accessKeyId, accessKeySecret, file);
  102.         Poster p = new Poster();
  103.         p.setId(1L);
  104.         p.setImage(url);
  105.         CommonResult r = service.operationPoster(p, "edit");
  106.         System.out.println(r);
  107.         return url;
  108.     }
  109.  
  110.     // 使用fastdfs进行文件上传
  111.     @RequestMapping("/uploadVideoToFast")
  112.     @ResponseBody
  113.     public Map<String, Object> uploadVideoToFast(@RequestParam("file") MultipartFile file)
  114.             throws IOException, InterruptedException {
  115.         File toFile = null;
  116.  
  117.         InputStream ins = null;
  118.         ins = file.getInputStream();
  119.         toFile = new File(file.getOriginalFilename());
  120.         inputStreamToFile(ins, toFile);
  121.         ins.close();
  122.  
  123.         String length = ReadVideoTime(toFile);
  124.         Map<String, Object> url = UploadVideoDemo.testUploadStream(accessKeyId, accessKeySecret, "视频",
  125.                 file.getOriginalFilename(), file.getInputStream());
  126.         url.put("length", length);
  127.         return url;
  128.     }
  129.  
  130.     private String ReadVideoTime(File source) throws InterruptedException {
  131.         Encoder encoder = new Encoder();
  132.         String length = "";
  133.         try {
  134.             MultimediaInfo m = encoder.getInfo(source);
  135.             long ls = m.getDuration() / ;
  136.             int hour = (int) (ls / );
  137.             int minute = (int) (ls % ) / ;
  138.             int second = (int) (ls - hour *  - minute * );
  139.             length = hour + ":" + minute + ":" + second;
  140.         } catch (Exception e) {
  141.             e.printStackTrace();
  142.         }
  143.         Thread.sleep();
  144.         System.out.println(source.getAbsolutePath());
  145.         System.out.println(source.getPath());
  146.         System.out.println(length);
  147.         System.out.println(source.delete());
  148.         return length;
  149.     }
  150.  
  151.     public static void inputStreamToFile(InputStream ins, File file) {
  152.         try {
  153.             OutputStream os = new FileOutputStream(file);
  154.             int bytesRead = ;
  155.             byte[] buffer = new byte[];
  156.             while ((bytesRead = ins.read(buffer, , )) != -) {
  157.                 os.write(buffer, , bytesRead);
  158.             }
  159.             os.close();
  160.             ins.close();
  161.         } catch (Exception e) {
  162.             e.printStackTrace();
  163.         }
  164.     }
  165.  
  166.     /**
  167.      * 删除单个文件
  168.      *
  169.      * @param fileName 要删除的文件的文件名
  170.      * @return 单个文件删除成功返回true，否则返回false
  171.      */
  172.     public static boolean deleteFile(String fileName) {
  173.         File file = new File(fileName);
  174.         // 如果文件路径所对应的文件存在，并且是一个文件，则直接删除
  175.         if (file.exists() && file.isFile()) {
  176.             if (file.delete()) {
  177.                 System.out.println("删除单个文件" + fileName + "成功！");
  178.                 return true;
  179.             } else {
  180.                 System.out.println("删除单个文件" + fileName + "失败！");
  181.                 return false;
  182.             }
  183.         } else {
  184.             System.out.println("删除单个文件失败：" + fileName + "不存在！");
  185.             return false;
  186.         }
  187.     }
  188. }

都是异步单张上传

上传图片,语音,和富文本（webuploader,dropzone, froala）的更多相关文章

  1. C#语音朗读文本 — TTS的实现

    TTS, Text To Speech的缩写,是使用语音朗读文本的技术.目前,在国内应用较多的是排队叫号系统 Windows 平台的TTS,通常使用的是微软自带的 Speech API. Window ...

  2. AWS机器学习初探（2）：文本翻译Translate、文本转语音Polly、语音转文本Transcribe

    AWS机器学习初探(1):Comprehend - 自然语言处理服务 这几个服务的功能和使用都很直接和简单,因此放在一篇文章中介绍. 1. 文本翻译服务 Translate 1.1 功能介绍 AWS ...

  3. 移动端h5实现拍照上传图片并预览&webuploader

    .移动端实现图片上传并预览,用到h5的input的file属性及filereader对象:经测除了android上不支持多图片上传,其他基本ok实用: 一:先说一下单张图片上传(先上代码): html ...

  4. django 高级扩展-中间件-上传图片-分页-富文本-celery

    """ django 高级扩展 一.静态文件 1.css,js,json,图片,字体等 2.配置setting,在最底下设置静态文件目录,写入下面代码 #配置静态文件目录 ...

  5. 文本转语音TTS(文本阅读和视频配音制作)MP3

    DL-TTS 通过AI驱动引擎可将文本转化为逼真的语音,它可以:(1)生成逼真的合成语音实现与人声的语调和情感匹配的流畅.发音自然的文本转语音.(2)细化的文本转语音控制支持多种语言,并可调整语速.语 ...

  6. itchat个人练习 语音与文本图灵测试例程

    背景介绍 itchat是一个开源的微信个人号接口,使用python调用微信从未如此简单. 使用不到三十行的代码,你就可以完成一个能够处理所有信息的微信机器人. 官方文档参考https://itchat ...

  7. Django之choices选项和富文本编辑器的使用

    项目准备 1.创建数据库 create database choices_test default charset utf8; 2.创建一个名为 choices_test 的Django项目: 3.创 ...

  8. DelphiXE10.2怎么安装文本转语音(TTS)语音转文本(SR)控件（XE10.2+WIN764）

    关资料: http://edn.embarcadero.com/article/29583 http://blog.sina.com.cn/s/blog_53866d7501017r1o.html 问 ...

  9. 问题-DelphiXE10.2怎么安装文本转语音(TTS)语音转文本(SR)控件（XE10.2+WIN764）

    相关资料: http://edn.embarcadero.com/article/29583 http://blog.sina.com.cn/s/blog_53866d7501017r1o.html ...

随机推荐

  1. css3属性clip

    clip 属性定义了元素的哪一部分是可见的.clip 属性只适用于 position:absolute 的元素. rect(<top>, <right>, <bottom ...

  2. HTTP状态码分类及异常状态码处理

    1xx:表示临时响应100:(继续)请求者应当继续提出请求.服务器返回此代码表示已收到请求的第一部分,正在等待其余部分101:(切换协议)请求者已要求服务器切换协议,服务器已确认并准备切换 2xx:表 ...

  3. UnicodeEncodeError: 'ascii' codec can't encode characters

    将网页get到之后输入文本出现UnicodeEncodeError: 'ascii' codec can't encode characters错误 f = open('re.txt', 'w') u ...

  4. [CDH] New project for ML pipeline

    启动后台服务: [CDH] Cloudera's Distribution including Apache Hadoop 这里只介绍一些基本的流程,具体操作还是需要实践代码. 一.开发环境配置 JD ...

  5. 虚拟机、云主机、VPS 三者之间的区别

    当我们想部署网站的时候,经常会听到vps.云主机.虚拟机等关键字,那么你知道这几者之间的区别吗?本文就讲解一下VPS.云主机.虚拟机之间的区别. 什么是VPS VPS 是Virtual Private ...

  6. 如何使用QTP12 UFT做功能性测试（转载）

    首先,按照本博客的安装教程走的,右键管理员运行 接下来点击继续,这个界面只需要勾选到web即可 点击ok,开始运行 进入到主界面之后,file新建一个测试. 可以修改路径等等 点击create之后,出 ...

  7. Int8，Int16，Int32，Int64 有啥不同呢？看了立马就懂！

    大家有没有写了很久代码,还不知道这个Int8,Int16, Int32, Int64有什么区别呢?或者是为什么后面的数字不一样呢? 初步了解了一下,才清楚这个东西. 先来扫盲一下计算机存储单元, 在计 ...

  8. openresty+lua+kafka方案与Tomcat接口并发度对比分析

    1.openresty+lua+kafka 1.1 openresty+lua+kafka方案 之前的项目基于nginx反向代理后转发到Tomcat的API接口进行业务处理,然后将json数据打入ka ...

  9. [AcWing30]正则表达式匹配

    [AcWing30]正则表达式匹配 请实现一个函数用来匹配包括'.'和'*'的正则表达式. 模式中的字符'.'表示任意一个字符,而'*'表示它前面的字符可以出现任意次(含0次). 例如,字符串&quo ...

  10. selenium登录豆瓣网

    登录流程: 实例化一个driver,然后driver.get()发送请求 最重要的:切换iframe子框架,因为豆瓣的网页中的登录那部分是一个ifrme,必须切换才能寻找到对应元素 利用seleniu ...