使用jquery获取匹配值的正确数据属性

时间:2014-11-06 11:35:48

标签: javascript jquery html

我有以下html

<div class="z-content" data-slug="aaa" data-content-url="some url 1"></div>
<div class="z-content" data-slug="bbb" data-content-url="some url 2"></div>

现在我在网址中有一个哈希值,我就这样得到了这个部分。

var hash = location.href.substr(location.href.indexOf('#')+1);

现在我想在前面提到的数据集中匹配该哈希值,并为该哈希值选择正确的data-content-url

var zcons = $('.z-content');
var zcon_array = [];

$.each(zcons, function (index, item) {       
    zcon_array.push( { value: $(item).data('slug')} );  
});

$.each(zcon_array, function(key, object) {
   if(object.value == hash)
   {
      alert($('.z-content').data('content-url'));  //But it picks up the first one ie 'some url 1' always 
   }
});

所以即使哈希是bbb,它也会转到第一个。

非常欢迎任何帮助/提示。提前谢谢。

1 个答案:

答案 0 :(得分:1)

data as getter返回集合中第一个元素的值。您可以使用当前索引来选择目标元素:

$('.z-content').eq(key) // use the index for filtering matching element
               .data('content-url');

但是没有必要创建一个数组。您可以使用filter方法:

$('.z-content').filter('[data-slug="' + hash + '"]').data('content-url');

请注意,window.location.hash会返回文档的当前hash属性。