zoukankan      html  css  js  c++  java
  • 修改input type=file 标签默认样式的简单方法

    <html>
    <head>
    <title></title>
    </head>
    <body>
    <form id="uploadForm"  action="" method="post" enctype="multipart/form-data">
    <input type="file" name="uploadFile" id="uploadFile" style="visibility:hidden;position:absolute;top:0px;0px"/><!--隐藏默认标签样式-->
    </form>
    <input type="button" value="上传" id="btn"/><!--修改为自己喜欢的样式即可,支持图片,对话框,按钮,DIV,注意id要和事件调取的ID一致-->
    </body>
    <script src="jquery183.min.js"></script>
        <script type="text/javascript">
            $(function () {
                //按钮的点击事件
                $('#btn').click(function () {
                    //触发file的点击事件
                    $('#uploadFile').click();
                });
                //file的change事件
                $('#uploadFile').change(function () {
                    //提交form表单的数据
                    $('#uploadForm').submit();
             //清空file标签的value,否则再次提交此文件时,onchange事件就不触发了
             $('#uploadFile').val(''); 
            }); 
        }); 
    </script>
    </html>

  • 相关阅读:
    RabbitMQ之Exchange(五)
    java classpath详解
    RabbitMQ之软件安装(一)
    RabbitMQ之概念介绍(二)
    RabbitMQ实战之Hello World(三)
    logback 控制台 自定义颜色
    hashmap
    linux学习记录 常用指令大全
    72.40个Android面试题(转载)
    break 的一个“高级用法”(转)
  • 原文地址:https://www.cnblogs.com/yuwenjing0727/p/7244325.html
Copyright © 2011-2022 走看看