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

Question

我收到此错误,它来自jquery框架.当我尝试在文档准备好时加载选择列表时,我收到此错误.我似乎无法找到为什么我得到这个错误.

它适用于更改事件,但我在尝试手动执行该函数时收到错误.

未捕获的TypeError:无法读取未定义的属性'toLowerCase' - > jquery-2.1.1.js:7300

这是代码

$(document).ready(function() {
    $("#CourseSelect").change(loadTeachers);
    loadTeachers();
});

function loadTeachers() {
    $.ajax({ 
        type: 'GET', 
        url: '/Manage/getTeachers/' + $(this).val(), 
        dataType: 'json', 
        cache: false,
        success:function(data) { 
            $('#TeacherSelect').get(0).options.length = 0;    
            $.each(data, function(i, teacher) {
                var option = $('<option />');
                option.val(teacher.employeeId);
                option.text(teacher.name);
                $('#TeacherSelect').append(option);
            });
        },         
        error: function() { 
            alert("Error while getting results"); 
        }
    });
}

Answer 1

当你调用loadTeachers()DOMReady时,上下文this将不是#CourseSelect元素.

您可以通过在加载DOM change()的#CourseSelect元素上触发事件来解决此问题:

$("#CourseSelect").change(loadTeachers).change(); // or .trigger('change');

或者可以$.proxy用来改变函数运行的上下文:

$("#CourseSelect").change(loadTeachers);
$.proxy(loadTeachers, $('#CourseSelect'))();

或者上面的香草JS等价物bind():

$("#CourseSelect").change(loadTeachers);
loadTeachers.bind($('#CourseSelect'));

Answer 2

我有同样的问题,我试图在一些选择上听取更改,实际上问题是我使用事件而不是event.target这是选择对象.

不正确:

$(document).on('change', $("select"), function(el) {
    console.log($(el).val());
});

正确:

$(document).on('change', $("select"), function(el) {
    console.log($(el.target).val());
});

Answer 3

$(this).val()当您访问时，当它被更改事件this指向调用者调用时，它会导致错误CourseSelect，即它正在工作并且将获取 的值CourseSelect。但当你手动调用它时，它this会指向文档。因此，您要么必须传递CourseSelect对象，要么直接访问，$("#CourseSelect").val()而不是$(this).val().

Answer 4

这对我有用！！！

调用不带参数的函数

$("#CourseSelect").change(function(e1) {
   loadTeachers();
});

调用带参数的函数

$("#CourseSelect").change(function(e1) {
    loadTeachers($(e1.target).val());
});