js验证上传的文件是否为JPEG,PNG,JPG,GIF格式

来源:互联网 发布:原生js获取json文件 编辑:程序博客网 时间:2024/04/30 08:24
function checkPhoto(){      var type="";     if(document.getElementById("newphoto").value!=''){      type=document.getElementById("newphoto").value.match(/^(.*)(\.)(.{1,8})$/)[3];         type=type.toUpperCase();     }           if(type!="JPEG"   &&   type!="PNG"   &&   type!="JPG"   &&   type!="GIF"){        alert("上传图片类型错误");          return false;       } } 





form表单,验证文件类型,文本是否为空,文本长度验证



js

<script type="text/javascript">    //进入下一步   function subForm() {form1.submit(); //form1为form的id }      //表单验证  $(function(){$("#addsubmit").click(function(){//表单校验if(validate()){$("#form1").submit();}});//进入文本框 隐藏错误提示框$("input").click(function(){$("#errorId").hide();});});//进行js校验  表单function validate(){var title =$.trim( $("#title").val());var content = $.trim($("#content").val());if(title == ""){//显示错误提示框$("#title").show();alert("标题不能为空")$("#title").html("标题不能为空");return false;}if(content == ""){//显示错误提示框$("#content").show();alert("内容不能为空")return false;}if(title.length>50){//显示错误提示框$("#title").show();alert("标题字数不能超过50字")$("#title").html("标题字数不能超过50字");return false;} var type="";     if(document.getElementById("pic").value!=''){      type=document.getElementById("pic").value.match(/^(.*)(\.)(.{1,8})$/)[3];         type=type.toUpperCase();     }            if(type!="JPEG"   &&   type!="PNG"   &&   type!="JPG"   &&   type!="GIF"){        alert("上传图片类型错误,只能上传JPEG,png,jpg类型图片");          return false;       } return true;}                     </script>   

form

 <form  id="form1" action="${pageContext.request.contextPath}/information/updateInformation.shtml"  method="post"  enctype="multipart/form-data">            <input  name="loginId"  type="hidden"  value="${userInfo.loginId}"/>            <input  name="schschoolId" type="hidden"   value="${userInfo.schschoolId}"  />            <input  name="id" type="hidden"   value="${information.id}"  />        <span class="left">文章标题:</span>        <input id="title"  type="text" class="text left w350 mr20" name="title" value="${information.title }" />        <span class="left">是否仅限本校学生查看:</span>        <div class="dropdown text w80 mr20">        <select  id="select_k1"   class="shadow" name="display" >        <option value="1" <c:if test="${information.display==1 }"> selected</c:if>  >是</option><option value="0" <c:if test="${information.display==0 }"> selected</c:if>   >否</option>    </select>                     <!-- 登陆id -->            </div>         <span class="left">类型:</span>        <div class="dropdown text w80 mr20">        <select name="type" id="select_k1"   class="shadow"><option value="1"  <c:if test="${information.type==1 }"> selected</c:if> >高校专版</option><option value="2"  <c:if test="${information.type==2 }"> selected</c:if>>发现</option>    </select>        </div>                           <span class="left">是否为轮播图:</span>        <div class="dropdown text w80 mr20">        <select name="isFigure" id="select_k1"   class="shadow"><option value="0"  <c:if test="${information.isFigure==0 }"> selected</c:if>>否</option><option value="1"<c:if test="${information.isFigure==1 }"> selected</c:if>>是</option>    </select>        </div>              <c:if test="${!empty information.coverImgUrl   }">        <img src="${ information.coverImgUrl }" />           </c:if>        <span class="left"  style="width:80px; height:15px;"></span>        <span class="left"  >封面图:</span>        <input id="pic"  type="file" class="text left w200 mr10" name="pic" value="${ information.coverImgUrl }"  />                 <textarea id="content" name="content" style="width:98%; height:185px;">         ${content }        </textarea>                   <div class="text-box pr30"><div class="btn-box">          <!--part-->          <div class="part tr">        <!--  <a title="发布" class="blue-btn btn-big mr10" onclick="subForm();">修改</a>-->                 <a title="发布"  id="addsubmit" href="javascript:;" class="blue-btn btn-big mr10">发布</a>            <a title="取消" class="btn gray-btn btn-big mr10" href="informationList.shtml">取消</a>           </div>          <!--part end-->        </div>        </div>                    </form>






0 0
原创粉丝点击