如何在引导弹出窗口中禁用多个 ajax 调用

问题描述

我已经实现了一个弹出框。每当您单击一个元素时，我都会发出 AJAX 请求。不幸的是，有两个 AJAX 调用被发送。我如何防止这种情况？我只想进行一次 AJAX 调用。

$(".btn-course-user").popover({
  html: true,trigger: 'manual',viewport: '',template: '',placement: 'bottom',content: function() {
    return $.ajax({
      url: 'lorem/ipsum/',dataType: 'html',async: false
    }).responseText;
  }
}).click(function(e) {
  $(this).popover('toggle');
});

每当我点击带有类选择器 .btn-course-user 的元素时，它都会发送两个 AJAX 请求。有人可以帮我防止它。我想发送一个请求。

解决方法

这是黑暗中的一个镜头，但考虑在弹出窗口之前运行请求，因为它可能在实例化过程中多次引用 content，导致 ajax 触发不止一次：

$(".btn-course-user").click( e => {
  // maybe show a loading message....
  let thisObj = $(this) ;
  $.ajax({
   url: 'lorem/ipsum/',dataType: 'html'
  }).done(function(ajaxContent) {
   thisObj.popover({
        html: true,trigger: 'manual',viewport: '',template: '',placement: 'bottom',content: ajaxContent
    }).off('click').click(function (e) {
        $(this).popover('toggle');
    });
  });
});

问题是我没有为弹出框添加标题属性。

For more clarity

bootstrap-popover javascript jquery