首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

对file输入框的美化,换成图片的模式

2012-07-15 
对file输入框的美化,换成图片的形式重点代码如下:?http://topic.csdn.net/t/20021015/15/1098840.html?in

对file输入框的美化,换成图片的形式

重点代码如下:

?

http://topic.csdn.net/t/20021015/15/1098840.html

?

<input ? id=a1 ? type=file ? style= "display:none "> <input ? type=button ? value=浏览 ? onclick=a1.click()>

?

?

?

?

?

自己写的代码内容如下:判断是否上传的是word文件,对file输入框的美化

?

?

?????????????????? <form method="post" name="tigangform" ENCTYPE="multipart/form-data">
??? ??? ??? ??? ??? <br><br>
??? ??? ??? ??? ??? ??? <input type="file"" id="pic" name="pic" style= "display:none ">
??? ??? ??? ??? ??? ??? <c:choose>
??? ??? ??? ??? ??? ??? <c:when test="${tiganglunweidzhied.tigang==4 || tiganglunweidzhied.tigang==3 || tiganglunweidzhied.tigang==2 }">
??? ??? ??? ??? ??? ???? <div style="display: none">
??? ??? ??? ??? ??? ??? <input type="button" id="name" name="name"/>
??? ??? ??? ??? ??? ??? <div id="lunwen1" name="lunwen1" value="论文(1)"/>
??? ??? ??? ??? ??? ??? <input type="hidden"" id="tigangstate" name="tigangstate" value="1"/>
??? ??? ??? ??? ??? ???

??? ??? ??? ??? ??? ??
??? ??? ??? ??? ??? ? </form>?
??? ??? ??? ??? ??? <script>
??? ??? ??? ??? ??? ??? $("#pic").change(function () {
??? ??? ??? ??? ??? ??? ??? tigangsrkxianshi();
??? ??? ??? ??? ??? ????? var value = $(this).val();
??? ??? ??? ??? ??? ??? ? ??? var filepath=value.substring(value.lastIndexOf('.')+1,value.length);
??? ??? ??? ??? ??? ??? ??? if(filepath != 'doc' && filepath != 'docx')
??? ??? ??? ??? ??? ??? ??? {
??? ??? ??? ??? ??? ??? ??? ??? alert("文件类型不正确,只能上传word文件,请重新选择!");
??? ??? ??? ??? ??? ??? ??? ??? ?$("#pic").val("");
??? ??? ??? ??? ??? ??? ??? ??? return false;
??? ??? ??? ??? ??? ??? ??? }
??? ??? ??? ??? ??? ????? $("#name").val(value);
??? ??? ??? ??? ??? ??? }).keyup();
??? ??? ??? ??? ??? ???
??? ??? ??? ??? ??? ??? function tigang(){
??????????????????????????? if(document.getElementById("pic").value==""){
??????????????????????????? ??? ?? alert("提示:\n请选择文件后上传!");
???????????????????????? ??? ?????? document.getElementById("pic").focus();
?????????????????????????????????? return false;
??????????????????????????? }else{

????????????????????????? ??? ??? var lunwen1=$("#lunwen1").val();
??? ??? ????????????????????? ??? var name=$("#name").val();
??? ??? ??????????????????????? var url=encodeURI("lw01_Upload_do_tigang.shtm?lunwen1="+lunwen1+"&name="+name);
??? ??? ????????????????????????? ??? url=encodeURI(url);
??? ??? ????????????????????????? ??? document.tigangform.action=url;
??? ??? ??? ??? ??? ??? ??? ??? ??? document.tigangform.submit();
??????????????????????????? }
??? ??? ??? ??? ??? ??? }
??? ??? ??? ??? ??? ???
??? ??? ??? ??? ??? ??? function tigangsrkxianshi(){
??? ??? ??? ??? ??? ??? ??? document.getElementById("tigangxianshiid").style.display="";
??? ??? ??? ??? ??? ??? }
??? ??? ??? ??? ??? </script>

热点排行