Home  >  Q&A  >  body text

javascript - How to remove the "no file selected" flag for input type=file?

<input type="file"> I want to remove the words "No file selected" at the end. How to do this?

高洛峰高洛峰2712 days ago1949

reply all(5)I'll reply

  • 黄舟

    黄舟2017-05-16 13:34:37

    They are all answers that are not what the question was asked

    <style>
    input[type="file"] {
      color: transparent;
    }
    </style>
    <input type="file">

    reply
    1
  • 天蓬老师

    天蓬老师2017-05-16 13:34:37

    The default style is too ugly. We can set the default input element transparency to 0 and then cover it with a custom element.
    http://codepen.io/zengkan0703...

    reply
    0
  • 滿天的星座

    滿天的星座2017-05-16 13:34:37

    <label class="button">
      <span>选择文件</span>
      <input type="file" style="display: none" onchange="处理函数">
    </label>
    .button {
      /* 自定义按钮样式 */
    }

    reply
    0
  • 阿神

    阿神2017-05-16 13:34:37

    <label for="inputFile" class="button">
    <span>Select file</span>
    </label>
    <input type="file" id="inputFile" style= "display: none" onchange="changed">

    Customize the label style yourself; when you click the label, you click the corresponding input,

    reply
    0
  • 某草草

    某草草2017-05-16 13:34:37

    Upload the code directly, you can refer to it.

    //css
    .imgboxa{
              position: absolute;
              color:#999;
              left: 50%;
              top: 50%;
              transform: translate3d(-50%,-50%,0);
              -moz-transform: translate3d(-50%,-50%,0);
              -ms-transform: translate3d(-50%,-50%,0);
              -webkit-transform: translate3d(-50%,-50%,0);
              -o-transform: translate3d(-50%,-50%,0);
            }
    //html
    <p class="imgBox1" data-value='' style='position:relative;width:100%;text-align:center'>
            <img class="addcarimg1 img-responsive" id="blah1" src="" style="width:100%;height:20rem;overflow:hidden;"/>
            <a href="javascript:;" class="imgboxa">
             <span class="iconadd jiaNo1">+</span></br>
             <span class="txt textNo1">身份证正面</span>
             <input style='position: absolute; left: 0px; top: 0px; height: 100%; width: 100%; opacity: 0;' type='file' class="imgInp imgInp1" id="imgInp" data-value='1' />
            </a>
        </p>  

    reply
    0
  • Cancelreply