input file美化，文件上传

<style>
    .a-upload {
    padding: 4px  4px 10px 10px;
    height: 25px;
    line-height: 20px;
    position: relative;
    cursor: pointer;
    color: #888;
    background: #fafafa;
    border: 1px solid #ddd;
    border-radius: 4px;    /* 什么鬼 */
    overflow: hidden; 
    display: inline-block; 
    *display: inline; 
    *zoom: 1 /* 什么鬼 */
}

.a-upload  input {
    position: absolute;
    font-size: 100px;
    right: 0;
    top: 0;
    opacity: 0;
    filter: alpha(opacity=0);/* 什么鬼 */
     cursor: pointer 
} 
.a-upload:hover 
{ 
color: #444; 
background: #eee;
 border-color: #ccc;
 text-decoration: none ;  /* 什么鬼 */

} 

</style>

        <div class="row upFile">
            <form id="form1" enctype="multipart/form-data"  target="_blank" method="post" action="~/comm/inexcel.ashx?action=test">
                <a href="javascript:;" class="a-upload btn-warning">
                    <input type="file" name="file" id="file" />点击上传文件
                </a>
                <label class="showFileName"></label>
            </form>
        </div>

        $(".a-upload").on("change", "input[type=‘file‘]", function () {
            var filePath = $(this).val();
            var extend = filePath.substr(filePath.indexOf(".") + 1);

            if (extend == "xls") {
                $("#form1").submit();//提交会保持原form中的参数
            }
            $(".showFileName").html("文件上传错误，只支持.xls（2003）");

        });

/ on的绑定事件比较重要，绑定后即使页面刷新，js也不会失效