Heim >Web-Frontend >HTML-Tutorial >如何更改input file 的按钮?_html/css_WEB-ITnose
input file
哪位高手指点一下,如何更改input file 的按钮,主要是按钮上的文字,不想要“浏览”?越详细越好谢谢这个没有改过,一般是用一个DIV,然后定位到input file上面,把它遮住。
我一般是把它隐藏掉,然后另外写一个按钮,点击这个按钮的时候触发input file按钮的click事件
这个好像不行吧。可以另外做个按钮,用脚本控制input文件,点击按钮时激发input文件。input这个做隐藏。这样可以实现。
模拟的 也贴个代码 学习中
<style type="text/css">.button{width:100px;height:30px;}.fileupload{filter:Alpha(opacity=0);opacity:0;position:absolute;z-index:1}</style><input id="fileupload" class="button fileupload" type="file" /><div style="position:absolute;top:40px;left:100px;background:green;height:100px;width:300px"> <button id="btnUpload" type="button" class="button">点我试试看</button></div><script type="text/javascript"> function offset(ele){ if(!ele || ele.nodeType != 1){ return null; } if(!ele.parentNode){ return {top:ele.offsetTop,left:ele.offsetLeft}; } var os = offset(ele.parentNode) || {}; return {top:ele.offsetTop + os.top || 0,left:ele.offsetLeft + os.left || 0}; } var fileuploader = document.getElementById("fileupload"), btnUploader = document.getElementById("btnUpload"); var o = offset(btnUploader); fileuploader.style.top=o.top+"px"; fileuploader.style.left=o.left+"px";</script>
都是这样的,何必改呢?