javascript - Rails/javascript 试图隐藏没有特定宽度的图像

Question

我正在尝试从网址中抓取图像，并且只允许用户选择特定大小的图像。我在让它与 Nokogirl 配合使用时遇到问题，并考虑在出现选择图像的页面时使用 jquery 在客户端进行处理。由于某种原因，它没有 100% 工作

.select_product 是呈现图像供用户选择的图像类的名称。

$(document).ready(function () {
    $("img").load(function () {
        $(".select_product").each(function () {
            var width = $(this).width();
            if (width < 100) {
                $(this).hide();
            }
        });
    });
});

这个js可以工作，但由于某种原因，它总是将“this”的宽度视为宽度<100，而实际上某些图像肯定更高。

Answer 1

load 事件为每个图像触发一次，假设您有 10 个图像，它会触发 10 次，并且当第一个图像加载时，即使其他图像尚未加载，也会执行处理程序，您可以改为监听 window 对象的 load 事件:

window.onload = function() {
    $(".select_product").filter(function() {
       return $(this).width() < 100;
    }).hide();
}

但是我会在服务器端读取图像的宽度，而不是加载然后隐藏它们，还要注意，从 jQuery 1.8 开始，jQuery load() 事件方法已被弃用。