Selaa lähdekoodia

Fix input event in IE

This closes https://github.com/select2/select2/issues/3300
This closes https://github.com/select2/select2/pull/3677
Kevin Brown 9 vuotta sitten
vanhempi
commit
66ae2ad1d5
1 muutettua tiedostoa jossa 39 lisäystä ja 17 poistoa
  1. 39 17
      src/js/select2/selection/search.js

+ 39 - 17
src/js/select2/selection/search.js

@@ -88,27 +88,49 @@ define([
     // Workaround for browsers which do not support the `input` event
     // This will prevent double-triggering of events for browsers which support
     // both the `keyup` and `input` events.
-    this.$selection.on('input', '.select2-search--inline', function (evt) {
-      // Unbind the duplicated `keyup` event
-      self.$selection.off('keyup.search');
-    });
-
-    this.$selection.on('keyup.search input', '.select2-search--inline',
-        function (evt) {
-      var key = evt.which;
+    this.$selection.on(
+      'input.searchcheck',
+      '.select2-search--inline',
+      function (evt) {
+        // Try to detect the IE version should the `documentMode` property that
+        // is stored on the document. This is only implemented in IE and is
+        // slightly cleaner than doing a user agent check.
+        // This property is not available in Edge, but Edge also doesn't have
+        // this bug.
+        var msie = document.documentMode;
+
+        // IE will trigger the `input` event when a placeholder is used on a
+        // search box. To get around this issue, we are forced to ignore all
+        // `input` events in IE and keep using `keyup`.
+        if (msie && msie <= 11) {
+          self.$selection.off('input.search input.searchcheck');
+          return;
+        }
 
-      // We can freely ignore events from modifier keys
-      if (key == KEYS.SHIFT || key == KEYS.CTRL || key == KEYS.ALT) {
-        return;
+        // Unbind the duplicated `keyup` event
+        self.$selection.off('keyup.search');
       }
+    );
 
-      // Tabbing will be handled during the `keydown` phase
-      if (key == KEYS.TAB) {
-        return;
-      }
+    this.$selection.on(
+      'keyup.search input.search',
+      '.select2-search--inline',
+      function (evt) {
+        var key = evt.which;
 
-      self.handleSearch(evt);
-    });
+        // We can freely ignore events from modifier keys
+        if (key == KEYS.SHIFT || key == KEYS.CTRL || key == KEYS.ALT) {
+          return;
+        }
+
+        // Tabbing will be handled during the `keydown` phase
+        if (key == KEYS.TAB) {
+          return;
+        }
+
+        self.handleSearch(evt);
+      }
+    );
   };
 
   /**