input file “No File Choosen” text hide using button in jquery MultiFile

问题

I have following input file

<input type="file" id="sampleInput" name="files" onchange="return Plugins.sampleAction(this);"/>

In this file input I'm trying to remove "No File Choosen" text, for that I did following modification

<input type="file" id="sampleInput" name="files" onchange="return Plugins.sampleAction(this);" style='display:none'/>
 <button id="image_alt" type="button">Select image</button>

<script type="text/javascript">
    $('#image_alt').addEventListener('click', function () {
        $('#sampleInput').click();
    });
</script>

but when I click button this one not opening the file up-loader window

回答1:

You can try this

 $('#image_alt').on('click', function () {
        $('#sampleInput').click();
    });

addEventListener is the javascript way to listen for events, but you call it on a JQuery object. Give a look at JQuery.on() to manage events using JQuery.

回答2:

try this

<button id="image_alt" type="button">Select image</button>
  <p class="file_selected">File name</p>
<script type="text/javascript">
    $('#image_alt').on('click', function () {
        $('#sampleInput').click();
    });
    function changeVal(obj,cnt){
       $(cnt).text($(obj).val());
    }
</script>

来源：https://stackoverflow.com/questions/42466136/input-file-no-file-choosen-text-hide-using-button-in-jquery-multifile