从jQuery插件返回true或false

时间:2011-12-06 22:49:25

标签: javascript jquery plugins each

我正在尝试编写一个简单的jQuery插件来测试画布是否为空白。但是,我在返回布尔值时遇到了麻烦。

(function ($) {
    $.fn.extend({ 
        isBlank : function() {
            return this.each(function () {
                var context = this.getContext('2d'),
                    imageData = context.getImageData(0, 0, this.offsetWidth, this.offsetHeight);

                for (var i = 0; i < imageData.data.length; i += 4) {
                    if (imageData.data[i+3] !== 0) {
                        return false;
                    }
                }

                return true;
            });
        }
    });
})(jQuery);

由于某种原因,这将返回canvas对象,而不是布尔值。但是,当我从each循环中取出代码时,它会按预期返回布尔值。

如何才能使用each循环?

4 个答案:

答案 0 :(得分:3)

它正在返回画布,因为这是从函数isBlank返回的内容。 return this.each(...)返回调用的jQuery对象isBlank

您需要在.each之前设置变量,在需要时将其设置为true或false,然后返回该变量。

注意:在.each内,return false功能如breakreturn truecontinue功能。

示例:

(function ($) {
    $.fn.extend({ 
        isBlank : function() {
            var ret = true;
            this.each(function () {
                var context = this.getContext('2d'),
                    imageData = context.getImageData(0, 0, this.offsetWidth, this.offsetHeight);

                for (var i = 0; i < imageData.data.length; i += 4) {
                    if (imageData.data[i+3] !== 0) {
                        ret = false;
                    }
                }
            });
            return ret;
        }
    });
})(jQuery);

答案 1 :(得分:2)

(function ($) {
    $.fn.extend({ 
        isBlank : function() {
            var result = true;
            this.each(function () {
                var context = this.getContext('2d'),
                    imageData = context.getImageData(0, 0, this.offsetWidth, this.offsetHeight);

                for (var i = 0; i < imageData.data.length; i += 4) {
                    if (imageData.data[i+3] !== 0) {
                        result = false;
                    }
                }
            });
            return result;
        }
    });
})(jQuery);

基本上,拉出多余的return语句,并在函数末尾返回一个值。

答案 2 :(得分:1)

您的代码在this.each上调用了一个返回值,该返回值应返回您正在调用.isBlank的对象。我删除了每个上的返回值,看看你期望的行为是通过来声明一个变量,并在.each调用之外声明一个变量。 {1}}然后返回,就像他在答案中提到的Rocket一样。

答案 3 :(得分:0)

通过设计,您的插件可以采用多个元素。这就是你迭代this

的原因

如果传入多个对象,有些空白,有些不是?要么将插件编码为仅使用一个对象,要么考虑更改插件如何通知您画布的状态。您可以将类添加到空白元素或数据标记,而不是返回false。

上述答案中的方法可行,但如果您使用它们,我建议您将插件名称更改为“AreAllBlank()”