Uncaughed TypeError: 정의되지 않은 속성 'toLowerCase'를 읽을 수 없습니다.
이 에러는 jquery 프레임워크에서 발생합니다.문서 준비 완료에 선택 목록을 로드하려고 하면 이 오류가 발생합니다.이 에러가 나는 이유를 찾을 수 없을 것 같습니다.
변경 이벤트에서는 동작하지만, 수동으로 기능을 실행하려고 하면 에러가 발생합니다.
Uncaught TypeError: 정의되지 않은 -> jquery-2.1.js:7300의 속성 'toLowerCase'를 읽을 수 없습니다.
여기 코드가 있습니다.
$(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");
}
});
}
전화할 때loadTeachers()
DOMReady에서this
가 되지 않을 것이다.#CourseSelect
요소.
이 문제를 해결하려면change()
의 이벤트#CourseSelect
DOM의 부하에 따른 요소:
$("#CourseSelect").change(loadTeachers).change(); // or .trigger('change');
다른 방법으로 사용할 수 있습니다.$.proxy
함수가 실행되는 컨텍스트를 변경하려면:
$("#CourseSelect").change(loadTeachers);
$.proxy(loadTeachers, $('#CourseSelect'))();
또는 위의 바닐라 JS에 상당합니다.bind()
:
$("#CourseSelect").change(loadTeachers);
loadTeachers.bind($('#CourseSelect'));
저도 같은 문제가 있었습니다.어떤 셀렉트에서 변경을 들으려고 했는데 실제로는 셀렉트 오브젝트인 event.target이 아닌 event를 사용하고 있었습니다.
틀렸다:
$(document).on('change', $("select"), function(el) {
console.log($(el).val());
});
정답:
$(document).on('change', $("select"), function(el) {
console.log($(el.target).val());
});
이것은 나에게 효과가 있다!!!
파라미터가 없는 함수를 호출하다
$("#CourseSelect").change(function(e1) {
loadTeachers();
});
파라미터를 사용한 함수 호출
$("#CourseSelect").change(function(e1) {
loadTeachers($(e1.target).val());
});
에 액세스 하면, 에러가 발생합니다.$(this).val()
변경 이벤트로 호출되었을 때this
호출자를 가리킵니다. CourseSelect
그래서 그것은 효과가 있고, 그리고 그 가치를 얻을 것이다.CourseSelect
수동으로 호출하면this
문서를 가리켜야 합니다. 그래서 당신은 그 문서를 통과해야 합니다.CourseSelect
오브젝트 또는 직접 접근하기$("#CourseSelect").val()
대신$(this).val()
.
실패"when trying to execute the function manually
왜냐면 넌 다른 '이거'가 있거든이는 메서드를 수동으로 호출할 때 염두에 둔 것이 아니라 다른 것(아마도 window 객체 또는 수동으로 호출할 때 가지고 있는 컨텍스트 객체)을 참조합니다.
$(this).val()은 변경 이벤트 함수 범위에 없기 때문에 ajax 호출에 스코프가 없습니다.
이 경우 변경 이벤트 자체에 대해 먼저 ajax 호출이 구현될 수 있습니다.그런데 함수를 만들고 변경 이벤트에서 해당 funciton을 호출하면 $(this).val()의 범위가 유효하지 않습니다.
단순히 ID 셀렉터를 사용하여 값을 얻을 수 있습니다.
$(#CourseSelect).val()
전체 코드는 다음과 같습니다.
$(document).ready(function ()
{
$("#CourseSelect").change(loadTeachers);
loadTeachers();
});
function loadTeachers()
{
$.ajax({ type:'GET', url:'/Manage/getTeachers/' + $(#CourseSelect).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"); }
});
}
언급URL : https://stackoverflow.com/questions/23723005/uncaught-typeerror-cannot-read-property-tolowercase-of-undefined
'programing' 카테고리의 다른 글
Angular-Chart.js 색상 변경 방법 (0) | 2023.03.14 |
---|---|
항목을 선택하면 AngularJS 선택 상자 옵션이 사라집니다. (0) | 2023.03.14 |
POM 오류: org.springframework를 찾을 수 없습니다.기동하다 (0) | 2023.03.14 |
WordPress 템플릿 이름을 번역하는 방법 (0) | 2023.03.14 |
div의 오프셋 가져오기반응의 상단 위치 (0) | 2023.03.14 |