web-dev-qa-db-ja.com

オブジェクトはプロパティまたはメソッド 'closest'をサポートしていません

私のjQuery関数がIEもEdgeも機能していないという情報を受け取りました。コンソールに次のメッセージが表示されます。

オブジェクトはプロパティまたはメソッド 'closest'をサポートしていません

これは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) {});
    }
});

それに対する修正があるかどうか誰かが私に言うことができますか？

jqueryinternet-explorermicrosoft-edge
14
Jbertrand

_event.target_はDOMノードであり、jQueryオブジェクトではないため、jQueryメソッドはありません

JQueryでは、代わりにjQueryオブジェクトである$(this)を使用します。

また、必要がない場合は、ターゲットを使用しないことをお勧めします。

UPDATE：新しいブラウザーにDOMメソッド closest が追加されたため、OPのコードはIE以外の新しいブラウザーで機能します。

以下は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) {});
  }
});
_

またはきちんとした：

_$('body').on('change', 'select', function(event) {
  var $sel = $(this), // the select changed
    val = this.value,
    id = this.id,
    isCouche = id.indexOf("couche") != -1;
  $.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
    }
  });
});
_
16
mplungjan

closest() はjQueryプロトタイプで定義されており、プレーンなJavaScriptオブジェクトでは使用できません。

event.targetは、イベントが発生したDOM要素です。その上でjQueryメソッドを使用するには、要素をjQueryでラップする必要があります。

変化する

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

に

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

event.targetはjQuery要素ではないため、Yuoは$()で囲む必要があります

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