Question

我加载了一个div类，其名称为“。预览”图片库，如下所示：

<img src="http://i2.cdn.turner.com/cnn/dam/assets/120226120954-mandela-paper-t1-main.jpg" alt="120226120954-mandela-paper-t1-main">
<img src="http://i2.cdn.turner.com/cnn/dam/assets/120226120954-mandela-paper-t1-main.jpg" alt="120226120954-mandela-paper-t1-main">
<img src="http://i.cdn.turner.com/cnn/.e/img/3.0/global/icons/video_icon.gif" alt="Video_icon">
.
.
.

如果存在条件，我有此函数用于删除img：

 $('.preview').load(function(e){
   img = $(this).find('img');
  if((img.height() < 50) || (img.width() < 50)){
   img.remove();
  }
 });

我的问题是每张图片都被移除

我只想从“。预览”中移除宽度或高度小于 50px的图像。< /强>

已编辑

我为每个图像输入值“0”以获取此代码的警报高度，因此请删除所有图像。但图像没有这个价值。

$('form#get_url_image').bind('ajax:success', function() { $('.preview img').load(function() { var $img = $(this); alert ($img.height()); if ($img.height() < 50 || $img.width() < 50) { $img.remove(); } }); });

我得到每个块的图像：

<div class="preview"> <% @images_urls.each do |image_url| %> <%= image_tag "#{image_url}" %> <% end %> </div>

Answer 1

您必须遍历各个<img>元素。

鉴于您的HTML和代码，我认为您想要在加载后检查图像的尺寸。为此，请使用：

$('.preview img').load(function() {
   var $img = $(this);
   if ($img.height() < 50 || $img.width() < 50) {
       $img.remove();
   }
});

Answer 2

因此，每当加载图片时，都会执行加载事件处理程序？

$(this).find('img')将始终在.preview内选择所有图像，因此img.remove();将删除所有图像。

我想您只想获得对当前加载的引用的引用，您可以使用event.target ^[docs]获取：

$('.preview').load(function(e){
   var img = $(e.target);
   if((img.height() < 50) || (img.width() < 50)){
     img.remove();
   }
});

Answer 3

试试这个：

<html>
<body>
    <a>Click</a>
    <div class="preview">
        <img src="http://placebox.es/200/200/rgb250,45,45/">
        <img src="http://placebox.es/200/200/rgb250,45,45/">
        <img src="http://placebox.es/20/200/rgb250,45,45/">
        <img src="http://placebox.es/200/20/rgb250,45,45/">
        <img src="http://placebox.es/48/48/rgb250,45,45/">
    </div>

    <script src='http://code.jquery.com/jquery-1.7.1.min.js'></script>
    <script>
    $(function(){
        $('a').on('click',function(){
            $('img').each(function(){
                var img= $(this);
                if (img.load()) {
                    if((img.height() < 50) || (img.width() < 50)){
                       img.remove()
                    }
                }
            })  
        })
    })
    </script>
</body>
</html>

如果条件jquery删除图像

已编辑

3 个答案: