javascript - 没有 src 的情况下很难隐藏图像

Question

我有以下一系列元素:

<div class="slidetpl">
  <img src >
</div>

如果图像没有来源，我想隐藏 .slidetpl。为此，我尝试了以下方法:

$('.slidetpl img').each(function () {
        if (this.src.length == 0) {
            $(this).parent().hide();
        }
   });

但这不起作用。

谁能指出我正确的方向或告诉我我做错了什么？

Answer 1

这对我有效果:

// Start an immediate invocable function expression, to auto 
// execute the internal code and isolate the code from the 
// outside JS scope.
(function( $, window, undefined ){

  // Find all the document images and iterate over them. In case you like to
  // to iterate only under slidetpl change the selector from
  // img to .slidetpl img
  $( 'img' ).each(
    function() {

      // If the empty string is equal with the src attribute of 
      // of the current item in the iteration
      if ( '' === $(this).attr('src') ) {

        // Then hide the current item in the iteration.
        $(this).hide();
      }
    }
  );
})( jQuery, this )

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src="" />
<img src />
<img src="http://www.iconsdb.com/icons/preview/icon-sets/web-2-orange-2/running-man-xxl.png" />

注意，上面的代码将隐藏所有 src 属性为空的图像。如果您只想隐藏 .slidetpl 的子元素，则可以将选择器从 img 修改为 .slidetpl img。