web-dev-qa-db-fra.com

L'objet ne prend pas en charge la propriété ou la méthode 'la plus proche'

Je viens de recevoir l'info que ma fonction jQuery ne fonctionne pas sur IE ni Edge. Dans la console, j'ai le message:

L'objet ne prend pas en charge la propriété ou la méthode 'la plus proche'

C'est le jQuery:

$('body').on('change', 'select', function (event) {
    if(event.target.id.indexOf("couche") >= 0) {
        $.ajax({
            url: "{{ redir2 }}",
            type: "POST",
            data: {
                ident: event.target.id,
                value: event.target.value,
                iscouche: "True"
            },
        }).done(function (msg) {
            if(msg.nothing == 1) {
                var what = event.target.closest('tbody');
                $(what).find("tr:gt(0)").remove();
            } else {
                var add = event.target.closest('tr');
                var toremove = msg.toremove.split(" ");
                for(var i = 0; i < toremove.length; i++) {
                    if(toremove[i].length > 0) {
                        jQuery(toremove[i]).remove();
                    }
                }
                jQuery(add).after(msg.ret);
            }
        });

    } else {
        $.ajax({
            url: "{{ redir2 }}",
            type: "POST",
            data: {
                ident: event.target.id,
                value: event.target.value,
                iscouche: "False"
            },
        }).done(function (msg) {});
    }
});

Quelqu'un peut-il me dire s'il y a un correctif pour cela?

jqueryinternet-explorermicrosoft-edge
9
Jbertrand

event.target est un nœud DOM, pas un objet jQuery, donc n'a aucune méthode jQuery 

Dans jQuery, utilisez plutôt $(this) qui est un objet jQuery.

Je suggère également que vous n'utilisez pas la cible si vous n'en avez pas besoin. 

UPDATE: les navigateurs les plus récents ont maintenant la méthode DOM le plus proche , de sorte que le code OPs fonctionne dans les navigateurs les plus récents, sauf IE.

Voici une version corrigée de jQuery:

$('body').on('change', 'select', function(event) {
  var $sel = $(this),    // the changed select
    id = this.id,        // or $(this).attr("id"); 
    val = $(this).val(); // or this.value
  if (id.indexOf("couche") >= 0) {
    $.ajax({
      url: "{{ redir2 }}",
      type: "POST",
      data: {
        ident: id,
        value: val,
        iscouche: "True"
      },
    }).done(function(msg) {
      if (msg.nothing == 1) {
        var what = $sel.closest('tbody')
        $(what).find("tr:gt(0)").remove();
      } else {
        var add = $sel.closest('tr');
        var toremove = msg.toremove.split(" ")
        for (var i = 0; i < toremove.length; i++) {
          if (toremove[i].length > 0) {
            jQuery(toremove[i]).remove();
          }
        }
        jQuery(add).after(msg.ret);
      }
    });

  } else {
    $.ajax({
      url: "{{ redir2 }}",
      type: "POST",
      data: {
        ident: id,
        value: val;,
        iscouche: "False"
      },
    }).done(function(msg) {});
  }
});

ou plus propre:

$('body').on('change', 'select', function(event) {
  var $sel = $(this), // the select changed
    id = this.id,
    isCouche = id.indexOf("couche") != -1,
    val = $(this).val();
  $.ajax({
    url: "{{ redir2 }}",
    type: "POST",
    data: {
      ident: id,
      value: val,
      iscouche: isCouche ? "True" : "False";
    },
  }).done(function(msg) {
    if (isCouche) {
      if (msg.nothing == 1) {
        var what = $sel.closest('tbody')
        $(what).find("tr:gt(0)").remove();
      } else {
        var add = $sel.closest('tr');
        var toremove = msg.toremove.split(" ")
        for (var i = 0; i < toremove.length; i++) {
          if (toremove[i].length > 0) {
            $(toremove[i]).remove();
          }
        }
        $(add).after(msg.ret);
      }
    } else {
      // handle not couche
    }
  });
});
13
mplungjan

closest() est défini sur le prototype jQuery, il ne peut pas être utilisé sur un objet JavaScript simple.

event.target est l'élément DOM sur lequel l'événement s'est produit. Pour utiliser les méthodes jQuery, l'élément doit être encapsulé dans jQuery.

Changement

var what = event.target.closest('tbody')

à

var what = $(event.target).closest('tbody')
14
Tushar

Yuo doit l'inclure dans $() car event.target n'est pas un élément jQuery

   $(event.target).closest('tr')
2
Ashkan Mobayen Khiabani