Javascript 是什么导致了我的；未捕获类型错误：无法读取属性'；toLowerCase'；“未定义”的定义；错误？

仅供参考，我已经阅读了相关的线程，并试图实现这个想法。尽管如此，我还是得到了经典

未捕获的TypeError:无法读取未定义的属性“toLowerCase”

错误，我不知道它来自代码中的哪一行，因为错误指向jQuery。我的代码是

    ReadinessColorSetter = (function () {

        this.ColorToRange = {
            '#f65314': [0, 30],
            '#ffbb00': [31, 70],
            '#7cbb00': [70, 100]
        }

        this.SetReadiness = function (ipt) {
            // ipt: input element containing
            var val = $(this).val(),
                newcolor = "#FFF"; // default
            for (var hexcode in this.ColorToRange) {
                var range = this.ColorToRange[hexcode];
                if (val >= range[0] && val < range[1]) {
                    newcolor = hexcode;
                    break;
                }
            }
            $(ipt).parent().children().last().css('background-color', newcolor);
        }

        return this;
    })();

    // On page load, set the color of the readiness       
    $(function () {
        $('input[class="completeness"]').each(function (el) {
            ReadinessColorSetter.SetReadiness(this);
        });
    });

    // When the readiness value is changed, set the color of the readiness
    //$('input[class="completeness"]').change(function () {
        //ReadinessColorSetter.SetReadiness(this);
    //});
    $(document).on('change', $('input[class="completeness"]'), function (el) {
        ReadinessColorSetter.SetReadiness($(el.target));
    });

    $('#change-submitted').click(function () {
        alert('Change submitter clicked'); // TEST
    });

ReadinessColorSetter=（函数（）{
this.colortrange={
"f65314":[0,30],，
"ffbb00":[31,70],，
“#7cbb00”：[70100]
}
this.SetReadiness=功能（ipt）{
//ipt：包含
var val=$（this.val（），
newcolor=“#FFF”//默认值
for（此.colortrange中的var hexcode）{
var range=this.colortrange[hexcode]；
如果（val>=范围[0]&&val<范围[1]）{
newcolor=hexcode；
打破
}
}
$（ipt）.parent（）.children（）.last（）.css（'background-color'，newcolor）；
}
归还这个；
})();
//在页面加载时，设置准备就绪的颜色
$（函数（）{
$（'input[class=“completency”]”）。每个（函数（el）{
ReadinesColorSetter.SetReadiness（本）；
});
});
//更改就绪值时，设置就绪的颜色
//$（'input[class=“completency”]”）。更改（函数（）{
//ReadinesColorSetter.SetReadiness（本）；
//});
$（文档）.on（'change'，$（'input[class=“completency”]”），函数（el）{
ReadinesColorSetter.SetReadiness（$（el.target））；
});
$（“#更改已提交”）。单击（函数（）{
警报（'单击更改提交者'）；//测试
});

正如你所见，我已经指出了我认为的问题所在，并尝试实施正确的修复

---

关于这个问题有什么指导吗？

这似乎是无效的：

 $(document).on('change', $('input[class="completeness"]'), function (el) {
 //-----------------------^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^----it should be a string

正如您所看到的，您已经传递了一个jquery对象，而在描述中，您应该看到它需要一个css选择器字符串，如：

 $(document).on('change', 'input.completeness', function (el) {

在方法中：

var val = $(ipt).val(),

如果条件是：

if (val >= range[0] && val <= range[1]) {
    newcolor = hexcode;//--^^----------------should be less than equal instead
    break;
}

---

如果（val>=范围[0]&&val这似乎无效：

 $(document).on('change', $('input[class="completeness"]'), function (el) {
 //-----------------------^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^----it should be a string

正如您所看到的，您已经传递了一个jquery对象，而在描述中，您应该看到它需要一个css选择器字符串，如：

 $(document).on('change', 'input.completeness', function (el) {

在方法中：

var val = $(ipt).val(),

如果条件是：

if (val >= range[0] && val <= range[1]) {
    newcolor = hexcode;//--^^----------------should be less than equal instead
    break;
}

如果（val>=范围[0]&&val查看：

 // On page load, set the color of the readiness       
$(function () {
    $('input[class="completeness"]').each(function (el) {
        ReadinessColorSetter.SetReadiness(this);
    });
});

$.each（）闭包具有[index，elements]的参数，如果要将unwrapped元素发送到SetReadiness函数，则应执行以下操作：

(function () {
    $('input[class="completeness"]').each(function (index, elem) {
        ReadinessColorSetter.SetReadiness(elem);
    });
})();

代码中还有另一个错误，即多次在jQuery元素对象中包装元素，这导致两种不同类型的对象被发送到SetReadiness函数，一种情况下是标准元素对象，另一种情况下是jQuery元素对象

将函数输入规范化为标准元素对象或jQuery元素对象，这样做可以消除杂乱的代码

    this.SetReadiness = function (ipt) {
        // ipt: element pre wrapped inside of a jQuery object.

        var val = ipt.val(),
            newcolor = "#FFF"; // default
        for (var hexcode in this.ColorToRange) {
            var range = this.ColorToRange[hexcode];
            if (val >= range[0] && val < range[1]) {
                newcolor = hexcode;
                break;
            }
        }
        ipt.parent().children().last().css('background-color', newcolor);
    }

this.SetReadiness=功能（ipt）{
//ipt：预先包装在jQuery对象内部的元素。
var val=ipt.val（），
newcolor=“#FFF”//默认值
for（此.colortrange中的var hexcode）{
var range=this.colortrange[hexcode]；
如果（val>=范围[0]&&val<范围[1]）{
newcolor=hexcode；
打破
}
}
ipt.parent（）.children（）.last（）.css（'background-color'，newcolor）；
}

留给您一个函数，该函数将纯jQuery元素对象作为参数，或者您可以发送一个标准元素对象，然后将其包装在SetReadiness函数中的jQuery元素对象中

希望这能解决您遇到的一些问题，每当您收到未定义的错误时，请始终检查是否将有效对象包装在$（object）中

像这样的标准化将清除您的错误，并为您提供清晰易读的代码。我没有研究代码的功能，只关注清除您未定义的错误。
查看：

 // On page load, set the color of the readiness       
$(function () {
    $('input[class="completeness"]').each(function (el) {
        ReadinessColorSetter.SetReadiness(this);
    });
});

$.each（）闭包具有[index，elements]的参数，如果要将unwrapped元素发送到SetReadiness函数，则应执行以下操作：

(function () {
    $('input[class="completeness"]').each(function (index, elem) {
        ReadinessColorSetter.SetReadiness(elem);
    });
})();

代码中还有另一个错误，即多次在jQuery元素对象中包装元素，这导致两种不同类型的对象被发送到SetReadiness函数，一种情况下是标准元素对象，另一种情况下是jQuery元素对象

将函数输入规范化为标准元素对象或jQuery元素对象，这样做可以消除杂乱的代码

    this.SetReadiness = function (ipt) {
        // ipt: element pre wrapped inside of a jQuery object.

        var val = ipt.val(),
            newcolor = "#FFF"; // default
        for (var hexcode in this.ColorToRange) {
            var range = this.ColorToRange[hexcode];
            if (val >= range[0] && val < range[1]) {
                newcolor = hexcode;
                break;
            }
        }
        ipt.parent().children().last().css('background-color', newcolor);
    }

this.SetReadiness=功能（ipt）{
//ipt：预先包装在jQuery对象内部的元素。
var val=ipt.val（），
newcolor=“#FFF”//默认值
for（此.colortrange中的var hexcode）{
var range=this.colortrange[hexcode]；
如果（val>=范围[0]&&val<范围[1]）{
newcolor=hexcode；
打破
}
}
ipt.parent（）.children（）.last（）.css（'background-color'，newcolor）；
}

留给您一个函数，该函数将纯jQuery元素对象作为参数，或者您可以发送一个标准元素对象，然后将其包装在SetReadiness函数中的jQuery元素对象中

希望这能解决您遇到的一些问题，每当您收到未定义的错误时，请始终检查是否将有效对象包装在$（object）中

像这样的标准化将清除您的错误，并提供清晰可读的代码