如何检查数据属性是否有值

时间:2014-12-08 22:18:09

标签: jquery

如果数据属性具有特定值,我如何检查jquery。 例如:

data-categories="first-value second-value third-value"

我只是想检查它是否有second-value

:::::::::更新问题:::::::::::: 我在这里创建一个portfilio过滤器导航代码。

    var $container = $('#container');
    var $categoryNavBar = $('.category-navbar');     
    var getCurrentCategory = function(){
          var filter = $categoryNavBar.find('li[class=select]').data('category');
          return filter;
    }

    $categoryNavBar.on('click', 'a', function(evt){
        evt.preventDefault();

        var $this = jQuery(this);

        if($this.parent('li').hasClass('select')){
            return;
        }

        $this.parent('li').addClass('select').siblings('li').removeClass('select');

        var elem =  $container;
        var filter = $this.parent('li').data('category');

        if(filter == 'all'){
            elem.children('div').show().addClass('hb_box hb-brick').css({'top': 200, 'left': 200});
        }else{
            elem.children('div[data-category="'+filter+'"]').show().addClass('hb_box hb-brick').css({'top': 200, 'left': 200});
            elem.children('div').not('.hb_box[data-category="'+filter+'"]')
                        .removeClass("hb_box hb-brick")
                        .hide();

        }


    });

3 个答案:

答案 0 :(得分:2)

您需要attribute contains selector$("[attr*='foo']")):

elem.children('div[data-category*="'+filter+'"]').show().addClass('hb_box hb-brick').css({'top': 200, 'left': 200});
elem.children('div').not('.hb_box[data-category*="'+filter+'"]')
                    .removeClass("hb_box hb-brick")
                    .hide();

答案 1 :(得分:0)

让我们说string = 'first-value second-value third-value'

您可以将字符串拆分为" ",它将为您提供数据属性中所有值的数组:

array = string.split(" ");

然后用一些简单的逻辑,你可以找出是否有第二个值

if array[1] != undefined {
  // do something
}

答案 2 :(得分:0)

如果将数据属性中的数据存储为数组,则可以执行以下检查:

var secVal = 'second-value';

if( $('div').data('categories').indexOf( secVal ) > -1 ) {
    alert( 'Has ' + secVal );
} else {
    alert( 'Does not have ' + secVal );
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div data-categories="['first-value', 'second-value', 'third-value']"></div>