浏览器后退按钮返回时不会触发更改事件。

Question

我在这个页面上有一个表单：

$(document).ready(function() {
  $(document).on('change', '.multi-file-upload', function() {
    console.log("change triggered");
  })
})

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

<form enctype="multipart/form-data" action="/court_records/import" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="✓"><input type="hidden" name="authenticity_token" value="zljqBRnDYPeLyyNJi+BNeEqHsmtDVTBMoq3NO963Kq5I+p2YM9OMp2dCEN75w==">
  <input type="file" name="file" id="file" multiple="multiple" class="multi-file-upload">
  <input type="submit" name="commit" value="Submit">
</form>

当我加载页面并添加文件时，“change triggered”被调用。但是当我点击提交按钮，然后进入新页面，再点击返回按钮尝试再次添加文件时，更改不会触发。

如何在从浏览器上的返回按钮加载页面时触发更改事件？

- Daniel Viglione

Answer 1

我使用了'pageshow'的组合和替换文件输入字段：

  $(window).on('pageshow', function(){
      $('.multi-file-upload').replaceWith($('.multi-file-upload').val('').clone(true));

      $(document).on('change','.multi-file-upload',function(){
          console.log("change triggered");
      })
  });

- Daniel Viglione

Answer 2

要在点击返回按钮时执行Javascript，请使用以下方式使用pageshow。

$(window).on('pageshow', function(){
    $(document).on('change','.multi-file-upload',function(){
        console.log("change triggered");
    })
});

- scorgn

---

你测试过这个吗？对我来说似乎没有起作用。 - Daniel Viglione