Question

<div class="form-group">
<span class='btn btn-file btn-block  btn-default'> <i class='pe pe-7s-video'> </i> Choose from Library
<input type='file'  class='form-control' name='answer_video' accept='video/*' capture='camera' placeholder='Record' id='answer_video'></span>
</div>

如何更改价值＆＃34;从图书馆中选择＆＃34;选择＆＃34;视频＆＃34;通过使用javascript文件输入选择文件后

Answer 1

你可以帮助jquery，希望它能帮到你。

CollapsingToolbarLayout

Answer 2

在change事件中，检查this.files是否超过 0 。

<强>演示

document.querySelector( "[name='answer_video']" ).addEventListener( "change", function(){
    if ( this.files.length > 0 )
    {
       this.parentNode.querySelector(".videoLabel").innerHTML = "file selected";
    }
    else
    {
       this.parentNode.querySelector(".videoLabel").innerHTML = "Choose from Library";
    }
});

<div class="form-group">
<span class='btn btn-file btn-block  btn-default'> <i class='pe pe-7s-video'> </i> <span class="videoLabel">Choose from Library</span>
<input type='file'  class='form-control' name='answer_video' accept='video/*' capture='camera' placeholder='Record' id='answer_video'></span>
</div>

Answer 3

您可以使用EventListener DOMContentLoaded和onchange做点什么参考here

document.addEventListener('DOMContentLoaded',function() {
document.querySelector('[type="file"]').onchange=changeEventHandler;
},false);

function changeEventHandler(event) {
    // You can use “this” to refer to the selected element.
     document.getElementById('video_option').innerHTML = 'video selected'; 
}

<div class="form-group">
<span  class='btn btn-file btn-block  btn-default'> <i class='pe pe-7s-video'> </i><span id='video_option'> Choose from Library</span>
<input type='file'  class='form-control' name='answer_video' accept='video/*' capture='camera' placeholder='Record' id='answer_video'></span>
</div>

Answer 4

您只需将onchange功能与input一起使用。

function changeName(){

document.getElementById("change").innerHTML = "changeName"

}

<div class="form-group">
<span id="change" class='btn btn-file btn-block  btn-default'> <i class='pe pe-7s-video'> </i> Choose from Library
</span>
<input type='file'  class='form-control' name='answer_video' placeholder='Record' id='answer_video' onchange="changeName()">
</div>

如何在使用javascript选择后更改文件输入值？

4 个答案: