2 
<a href="javascript:void(0)" id="select-handler">select</a>
<input type="file" id="real-file-input" style="display:none" />

$('#select-handler').click(function(){
    $('#real-file-input').click(); 
});

$('#real-file-input').bind('propertychange', function(){
    alert('changed');
});

奇怪的是，当我使用.click()时propertychange不会被解雇。

4

2 回答 2

4

实际上，您的代码在IE7 和 8中对我来说运行良好，每当我更改 的值时input type ='file'，都会触发警报。而它不适用于> IE9版本。

来自paulbakauspropertychange在 Internet Explorer 9 上的博客

propertychangeIE9有什么问题？

  1. 通过 addEventListener 绑定非标准事件时，IE9 不会触发它们。每个使用特征检测的现代 JS 库，包括 jQuery，都会失败（另见： http ://bugs.jquery.com/ticket/8485 ）。你说“不是什么大事”，“直接使用 attachEvent”？

  2. 好消息：使用 attachEvent 时会触发 propertychange。坏消息：当修改引擎未知的元素上的任何 CSS 属性时，它拒绝触发。“这很糟糕，”你说，“但我读到你可以在 IE9 上使用 DOMAttrModified！” 你说？

  3. DOMAttrModified具有完全相同的行为。它不会因为未知的 CSS 属性而触发。这是一场彻头彻尾的灾难。

许多开发人员面临同样的奇怪行为。

为什么要使用onpropertychange只有 Internet Explorer 支持的？

我宁愿继续使用change事件处理程序

$('#real-file-input').bind('change', function(){
    alert('changed');
});

或者如果它是HTML5则input事件处理程序。

$('#real-file-input').bind('input', function(){
    alert('changed');
});
于 2013-08-26T05:20:55.597 回答
1

不幸的是，IE9 不支持删除时的“input propertychange”事件。使用带有 event.which 的“keyup”事件可以轻松捕获转义、删除和退格，但是通过右键单击 -> 删除选择文本和删除不会触发事件属性更改、更改、选择或 keyup/keydown。

到目前为止，我没有找到解决此问题的方法。

这是我的代码：

$('#search_input').on("propertychange input", function(event){
  console.log('propertychange event');
  // trigger search
});
$('#search_input').on("keyup", function(event){
  console.log('keyup event', event.which);
  if(event.which === 27) { // on ESC empty value and clear search
    $(this).val('');
    // trigger search
  } else if(event.which === 8 || event.which === 46) { // trigger search on Backspace
    // trigger search
  }
});
$('#search_input').on("change input", function(event){
  console.log('change event');
  // trigger search
});
$('#search_input').on("select input", function(event){
  console.log('select event');
  // trigger search
});
于 2015-02-11T17:21:19.987 回答