search
LoginSignup
9
Help us understand the problem. What are the problem?

More than 3 years have passed since last update.

posted at

updated at

input file に同じファイルonchangeが発火されない

ファイルアップロードで型がfileのinputタグを使う時に、同じファイルを再度選択する時に、onChangeイベントが発火しないことを気づいた。
調べてみたら、同じファイルを選んだ時に、inputタグのvalueの値が変わってないから発火しない原因です。
その為、inputのonClickでvalueを初期化すれば、直れます。下記react用ソースコードをメモします。

  • 修正前

<input
  type="file"
  accept="application/pdf"
  value=""
  onChange={this.doUpload}
  />
  • 修正後

<input
  type="file"
  accept="application/pdf"
  value=""
  onChange={this.doUpload}
  onClick={(e) => {
    // valueを初期化する
    e.target.value = '';
  }}
  />

参考記事

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
9
Help us understand the problem. What are the problem?