前台获取并限制上传文件大小、上传文件格式

        <input type="file" id="file"/>
        <input type="button" id="btn" value="js查看文件大小"/>
        <input type="button" id="btn1" value="jq查看文件大小"/>
        <script>
            //js获取上传文件大小（单位：字节）
 document.getElementById("btn").onclick=function(){ alert(document.getElementById("file").files[0].size); }; //jq获取上传文件大小（单位：字节） jq转js，加下标即可
 $("#btn1").click(function(){ alert($("#file")[0].files[0].size); }); </script>

 

        <div id="fileparent"><input type="file" id="file"/></div>
        <input type="button" id="btn" value="js查看文件大小"/>
        <input type="button" id="btn1" value="jq查看文件大小"/>
        <script>
            //js获取上传文件大小（单位：字节）
 document.getElementById("btn").onclick=function(){ alert(document.getElementById("file").files[0].size); }; //限制上传文件大小（单位：字节） 
            //限制上传文件格式，可直接判断后缀或者用indexOf方法判断后缀格式是否符合要求
 $("#btn1").click(function(){ alert($("#file")[0].files[0].size); if($("#file")[0].files[0].size>1024000){ alert("文件过大！"); //清理file里的文件内容
 $("#fileparent").html('<input type="file" id="file"/>'); return; } alert($("#file").val()); //获取上传文件路径
                var string=$("#file")[0].value; //对路径字符串进行剪切截取
                var arrays=string.split("\\"); //获取文件名，包含后缀
                var name=arrays[arrays.length-1]; alert(name); //为了辨别格式，统一变小写
 name=name.toLowerCase(); if(!(name.endsWith("png")||name.endsWith("jpg")||name.endsWith("jpeg"))){ alert("请上传jpg、jpeg或png格式的图片！"); //清理file里的文件内容
 $("#fileparent").html('<input type="file" id="file"/>'); } });