隐藏<article>如果有一个空的src&#34;&#34;用jquery </article>

时间:2015-01-22 09:05:06

标签: javascript jquery html css

如果$ img为空,我如何隐藏下面的文章?

<article data-stars="<?php echo $StarRating[6];?>" name="<?php echo $Price[6];?>" class="box">
<img width="270" height="160" alt="" src="<?php echo $img[6][1];?>"></a>
<div>Content</div>
</article>

我使用两个jquery过滤器过滤相同的aricle(s) 价格筛选:

tjq(document).ready(function() {
      tjq("#price-range").slider({
          range: true,
          min: 0,
          max: 3000,
          values: [ 1, 2000 ],
          slide: function( event, ui ) {
              tjq(".min-price-label").html( "€" + ui.values[ 0 ]);
              tjq(".max-price-label").html( "€" + ui.values[ 1 ]);

              $('article[data-price]').each(function() {
                  var dPrice = $(this).attr('data-price');
                  if ( dPrice < ui.values[ 0 ] || dPrice > ui.values[ 1 ] ) 
                      $(this).hide();
                  else
                      $(this).show();
              });
          }
      });

和星级评分过滤器

 $('input[type=checkbox]').click(function(e){
  $("input[type=checkbox]").each(function(){
  grabVal = $(this).val();
          if(!$(this).is(":checked")){
  $("article[data-stars='"+grabVal+"']").hide();
          }else{
  $("article[data-stars='"+grabVal+"']").show();
          }
      });

          if(!$("input[type=checkbox]").is(":checked")){
  $("article").show();   
      }
  });

本文的最后一个过滤器是: 显示更少/更多

$(document).ready(function () {
  $('#hotel-list article:gt(4)').hide();
  $('#loadMore').click(function () {
  $('#hotel-list article:hidden:lt(2)').show();
      });
  $('#showLess').click(function () {
  $('#hotel-list article').not(':lt(4)').hide();
      });
  });

你能不能帮我创建另一个过滤器来隐藏有空img的aricle,

2 个答案:

答案 0 :(得分:1)

我给你这个JSFiddle。

有了它,你可以隐藏你的img src是否为空。

我在上面放了一个课程,用这个代码就可以做你想做的事。

    $('.myClass').each(function(){
       if($(this).attr('src') == ""){
          $(this).closest('article').hide();
       }
    });

Fiddle here

答案 1 :(得分:0)

这不是用空的img隐藏所有文章的最短方式吗?

$("article img[src=""]").each(function() {
    $(this).parent().hide();
});