Laravel Popover在链接悬停时包含带有AJAX的动态数据

Question

在我的Laravel应用中，我有一个从数据库中获取的列表，类似于下图：

每个标题具有ID号。与之相关联[即“保姆”的ID号为7662]，每个标题均具有类似于波纹管图片的特定任务。例如，条目“ The Nanny”具有以下任务：

我想要做的是将鼠标悬停在标题链接上并显示一个弹出框，然后将鼠标悬停在弹出框上，该弹出框将使用ajax获取该特定ID /条目的任务。弹出框将被关闭按钮关闭。我试图在ajax中加载任务列表的视图，但是没有用。谁能告诉我该怎么做？任何可能有用的资源的链接。我见过PHP-MySQL的资源，但没有涉及Laravel的具体信息。

Answer 1

对于popover，如果您使用引导程序，则可以使用bootstrap popover。因此，对于将鼠标悬停在弹出窗口上的ajax，您可以使用“ mouseenter”事件，即

$("item").mouseenter(function() {
  $.ajax({
    'type': 'POST',
    'url': 'handlers/route_request.php',
    'dataType': 'html',
    'success': function (data) {
       console.log(data);
    }
  })
});

您应该了解一些将内容附加到特定DOM元素的JS方法。 我认为最好的方法是使用一些JS框架，即我正在使用Vue，尤其是默认情况下，它已在Laravel项目中就绪。