关于JS获取标签中的的方法及上传下载

<tr> <th class="jcjh1" > <input id="selectradio" type="radio" name="rec" value="0" onclick="showSelectSpot()" checked="checked">选择 <input id="textradio" type="radio" name="rec" value="1" onclick="showTextSpot()">输入 地点名称 </th> <td id="jcddselect"> <input type="hidden" id="spotName1" name="danger.spotName" value="${danger.spotName}"/> <select id="spotSelect" onchange="showdynamicSpot()"> <option value="">请选择</option> <s:iterator value="spots" var = "item"> <option value="<s:property value="#item.jcddmc"/>"> <s:property value="#item.jcddmc"/> </option> </s:iterator> </select> </td> <td id="jcddtext" class="jcjh" style="display: none;"> <input type="text" id="spotName2" name="danger.spotName" value="${danger.spotName}"/> </td> <th class="jcjh1" >动态地点</th> <td> <input id="dynamicSpot" type="text" class="search_ipt easyui-validatebox " value="${danger.dynamicSpot }" name="danger.dynamicSpot" data-options="required:true"/> </td> </tr>

使用JQuer的Id选择器：

function showSelectSpot(){ $("#jcddtext").css('display','none'); $("#jcddselect").css('display','block'); } function showTextSpot(){ $("#jcddtext").css('display','block'); $("#jcddselect").css('display','none'); } if("${spots}"!=null && "${spots}"=="[]"){ //根据参数的状态对input标签进行显示设置 JQuery类型选择器 $("input[type='radio'][value='0']").attr("disabled",true); $("input[type='radio'][value='0']").attr("checked",false); $("input[type='radio'][value='1']").attr("checked",true); showTextSpot(); } if("${danger.spotName}"){ getSpotName("${danger.spotName}"); }

 

 

关于附件的下载：

1.

<tr> <th class="jcjh1">复查附件:</th> <td data-name="${danger.recheckFileNum}" data-file="${danger.recheckFilePath}" onclick="downFile(this)" style="color:rgb(27, 192, 244);cursor:pointer;"> ${danger.recheckFileNum } </td> </tr> function downFile(tag){ var path = null; var filename=null; if($("#audioFilePath").val!=null){ filename =$(tag).data("name"); path=$(tag).data("file"); } if(path == ""){ $.messager.alert('系统提示', '文件路径不存在 ', 'info'); return; } $("#downloadfile").val(path); $("#downloadname").val(filename); $("#downfrm").submit(); } <script type="text/javascript" src="<%=basePath %>/resources/scripts/frameworks/jquery-1.8.0.min.js"></script> <script type="text/javascript" src="<%=basePath %>/resources/scripts/jquery.crs/jquery.crs.utils.js"></script> <link rel="stylesheet" type="text/css" href="<%=basePath %>/resources/styles/crs-default.css" /> <link rel="stylesheet" type="text/css" href="<%=basePath %>/resources/scripts/frameworks/jquery.easyui.1.3.2/themes/icon.css" /> <link rel="stylesheet" type="text/css" href="<%=basePath %>/resources/scripts/frameworks/jquery.easyui.1.3.2/themes/default/easyui.css"/> <script type="text/javascript" src="<%=basePath %>/resources/scripts/frameworks/jquery.easyui.1.3.2/jquery.easyui.min.js"></script> <script type="text/javascript" src="<%=basePath %>/resources/scripts/jquery.crs/jquery.easyui.validaterules.js"></script> <script type="text/javascript" src="<%=basePath %>/resources/scripts/frameworks/jquery.easyui.1.3.2/locale/easyui-lang-zh_CN.js"></script>

2.

<tr> <th width="20%" class="jcjh1" align="center">复查附件</th> <td class="jcjh"> <div style="width:315px;height:25px; position: relative;display:inline-block;" > <input type="text" id="paperFile" name="danger.recheckFileNum" value="" readonly="readonly" class="crs-upload-name easyui-validatebox" style="width: 290px;padding-right: 26px; height:23px" /> <input type="hidden" id="audioFilePath" name="danger.recheckFilePath" value="${danger.recheckFilePath}" class="crs-upload-path"/> <span id="paperUploader" class="crs-ile-uploader" style="position: absolute;" title="上传文件"></span> </div> //下载 <input id="downloadBtn" type="button" onclick="downFile()" class="crs-ep-down" style="position:relative;left:12px;padding-left: 70px;top: -3px;" /> </td> </tr> /* 下载复查附件 */ function downFile(){ var path = null; var filename=null; if($("#audioFilePath").val!=null){ path = $("#audioFilePath").val(); filename=$("#paperFile").val(); } if(path == "" ||path == null){ $.messager.alert('系统提示', '文件路径不存在 ', 'info'); return; } $("#downloadfile").val(path); $("#downloadname").val(filename); $("#downfrm").submit(); }

地址验证可以使用如下方法验证：

if(!path){ $.messager.alert('系统提示', '文件路径不存在 ', 'info'); return; }

上传

$("#paperUploader").kyuploadify({ width:30, height:23, formData:{"pair.clsid":"danger","pair.ajax":true}, fileTypeDesc:"复查附件", fileTypeExts: '*.doc;*.docx;*.xls;*.xlsx;*.pdf', onUploadSuccess:function(file,data){ $.crs.result(data,function(ret){ $("#paperFile").val(file.name); $("#audioFilePath").val(ret.attributes["path"]); },function(){ $.messager.alert("系统消息","上传文件失败！","error"); }) }, onUploadError:function(file){ } });

 

<form id="downfrm" action="file!download.action" method="post"> <input id="downloadname" type="hidden" name="pair.filename"/> <input id="downloadfile" type="hidden" name="pair.path" /> </form>

 

 

<link rel="stylesheet" href="styles/common/css/bootstrap.min.css" type="text/css" /> <link href="styles/common/css/blue.css" type="text/css" rel="stylesheet"/> <link href="styles/css/blue.css" type="text/css" rel="stylesheet" /> <link rel="stylesheet" type="text/css" href="resources/scripts/frameworks/jquery.easyui.1.3.2/themes/icon.css" /> <link href="resources/scripts/jquery.crs/uploadify.css" type="text/css" rel="stylesheet"></link> <script type="text/javascript" src="scripts/jquery.crs/jquery.crs.kyform.js"></script> <script type="text/javascript" src="resources/scripts/frameworks/jquery.uploadify.3.2.1/jquery.uploadify.min.js"></script> <script type="text/javascript" src="resources/scripts/jquery.crs/jquery.crs.kyuploadify.js"></script>

 

转载于:https://www.cnblogs.com/flytogalaxy/p/7889686.html