单击按钮时清除输入文件名

Question

参考上图，如何清除＆＃34; Koala.jpg＆＃34;文件名，每次用户点击删除按钮时，都在引导程序模式中。

＆＃13;

＆＃13;

$('#delImg').on({
  click: function() {
    $('#fileupload').attr("value", "");
    $('#fileupload').attr("src", "");
  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<div class="modal-body">
  <div class="box-body">
    <form method="post" action="#">
      <div>
        <textarea id="" ng-model="" style="" class="textarea" placeholder="Post something"></textarea>
      </div>
    </form>
  </div>
  <div class="form-group">
    <label for="exampleInputFile">File input</label>
    <input type="file" id="exampleInputFile">
    <div id="imgdispy"></div>
    <p class="help-block">Example block-level help text here.</p>
  </div>
</div>
<button type="button" id="delImg" class="btn btn-default btn-hover-green" data-action="save" data-dismiss="modal" role="button">Delete</button>
</div>

＆＃13;

＆＃13;

＆＃13;

以上代码无效

经过一些谷歌搜索，清除缓存可能是解决方案，但需要帮助理解语法和真正的原因。

Answer 1

您可以将文件输入替换为其克隆;

 $('body #exampleInputFile').replaceWith($('body #exampleInputFile').val('').clone(true));

以下是工作代码

$('#delImg').on('click', function() {
   // $('#fileupload').attr("value", "");
   // $('#fileupload').attr("src", "");
   
    $('body #exampleInputFile').replaceWith($('body #exampleInputFile').val('').clone(true));

  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<div class="modal-body">
  <div class="box-body">
    <form method="post" action="#">
      <div>
        <textarea id="" ng-model="" style="" class="textarea" placeholder="Post something"></textarea>
      </div>
    </form>
  </div>
  <div class="form-group">
    <label for="exampleInputFile">File input</label>
    <input type="file" id="exampleInputFile">
    <div id="imgdispy"></div>
    <p class="help-block">Example block-level help text here.</p>
  </div>
</div>
<button type="button" id="delImg" class="btn btn-default btn-hover-green" data-action="save" data-dismiss="modal" role="button">Delete</button>
</div>