javascript - jQuery 与附加数据交互

Question

谁能指出我在这里做错了什么？我正在尝试与数据交互(使用 ajax 附加)

如果该元素已经在 DOM 中，则警报会触发，但在附加元素时不会。

我是不是用错了“.on”？

$(function() {

  $('.card').on('click','.add-exercise', function() {
    alert('clicked');
  });

  // Detect 'enter' key up
  $('#search').on('keyup', function(e){
    if(e.keyCode == 13)
    {
      console.log('hit enter key');
      $(this).trigger("enterKey");
    }
  });

  $('#search').on("enterKey",function(e){

    $.ajax({
      url: '{{ url("exercises/load") }}',
      method: "POST",
      data: {
        _token: "{{csrf_token()}}",
        search: $('#search').val(),
      },
      dataType: "text",
      success: function(data) {
        console.log(data);
        $('.exercise-result').remove();
        $('.card-deck').append(data);
      }
    });

  });

});

Answer 1

我猜你在 data 中还有其他 .card 元素。

您必须为他们再次分配事件click。该事件目前仅分配给您的第一个 .card 元素。这就是为什么它不会在您的新 .card 元素上触发。