在AJAX调用中发送DIV元素的ID

时间:2016-04-25 09:49:50

标签: javascript jquery ajax notifications

我为我的Laravel应用程序设置了一个相对基本的通知系统,并且已经生成并向某人显示通知。

我现在正在进行构建功能以清除通知计数的动作,并设法使用一些jQuery来完成此操作。我需要进一步了解所有正在显示的通知的ID,以便我可以在AJAX调用中发送它们,以便我可以在数据库中看到它们。

作为一个非常基本的复制和粘贴,我创建了JSFiddle的功能。由于它缺少我的CSS文件和资源,它不起作用或看起来像我最终... ...

在小提琴中,通知的idnotification-id-X开头,其中X是显示的通知的ID,data-id属性显示相同的内容(I& #39;我不确定是否需要这样做。)

从我的搜索中,似乎我想使用类似下面的内容来搜索以id开头的所有notification-id-

var notifications = $('[id^="notification-id-"]');

在完成此操作后,我无法弄清楚如何处理notifications对象以获取我找到的所有ID并将其发送到我的Laravel应用程序可以进行的AJAX调用中读他们。

1 个答案:

答案 0 :(得分:3)

你的notifications变成了一个jQuery对象,它包含与该选择器匹配的所有元素。只需遍历这些元素并创建一个存储其ID的数组:

var notifications = $('[id^="notification-id-"]').map(function() {
    return this.id.slice(16);
}).get();

这将为您提供一个包含变量notifications中的ID的数组。

通过AJAX发送它们:

$.ajax({
    url: "my_server_script.php",
    method: "POST" // Or whatever you're using (GET, PUT, etc.)
    data: notifications // Let jQuery handle packing the data for you
    success: function(response) {
         // The data was sent successfully and the server has responded (may have failed server side)
    },
    error: function(xhr, textStatus, errorThrown) {
        // AJAX (sending data) failed
    },
    complete: function() {
        // Runs at the end (after success or error) and always runs
    }
});