使用jquery .each遍历div并检索data-src

时间:2018-07-04 15:44:46

标签: jquery each

我有一个div,其中有一堆子div,每个子div都具有data-src属性。我正在尝试遍历这些变量,并使用.each jquery函数在控制台中将它们返回。我正在使用以下代码:

function rolloverImages() {
  $('.thumbnail-wrapper').mouseover(function() {
    var rollovers = $(this).find('rolloverimages');
    rollovers.each(function() {
      console.log( index + ": " + $(this).data('src') );
    });
  });
}

<div class="rolloverimages">
                                        <div data-src="/wp-content/uploads/2018/06/blue-moon-creative-ochre-5.jpg"></div>
                                        <div data-src="/wp-content/uploads/2018/06/blue-moon-creative-ochre-8.jpg"></div>
                                        <div data-src="/wp-content/uploads/2018/06/blue-moon-creative-ochre-9.jpg"></div>
                                        <div data-src="/wp-content/uploads/2018/06/blue-moon-creative-ochre-3.jpg"></div>
                                        <div data-src="/wp-content/uploads/2018/06/blue-moon-creative-ochre-6.png"></div>
                                        <div data-src="/wp-content/uploads/2018/06/blue-moon-creative-ochre-4.jpg"></div>
                                        <div data-src=""></div>
                                        <div data-src="/wp-content/uploads/2018/06/blue-moon-creative-ochre-7.jpg"></div>
                                    </div>

但是,我的东西没有用。我相信这可能与我使用控制台日志有关。

有人可以帮忙吗?

1 个答案:

答案 0 :(得分:1)

您正在使用它,用法如下:

$('.rolloverimages div').each(function()
{
    console.log($(this).attr('data-src')); // this will output the value for data-src in console
})

然后您可以在循环内执行任何操作。

请注意,这不是复制粘贴解决方案-可以根据需要进行修改,但这是该功能的工作原理。

参考: https://api.jquery.com/jQuery.each/