비바라기's
[JS] $(document).on은 되는데 $(”#id”).on은 안될 때 본문
<script>
$(document).on('click',"#testButton", function(){
alert("yup");
})
$("#testButton").on('click', function(){
alert("yup")
})
</script>
// -----
<body>
<input type="button" id="testButton" value="test">
</body>
$(document).on을 사용한 방식과 $("#id').on을 사용한 방식은 둘 다 같은 것(#testButton)을 가리키고 있고, 의미도 동일하지만, 실제로 동작시켜보면 alert("yup")은 한 번만 발생합니다.이것은 $(document).on 방식은 document가 파싱된 뒤 id가 testButton인 노드를 찾아 함수를 실행시키지만, $('#id').on과 같은 방식은 document가 파싱되기 전에 id=#testButton인 <button>을 찾고 있으므로 그곳에 도달할 수 없어 함수를 실행시킬 수 없었기 때문입니다.
따라서 다음과 같이 수정하면 $('#id').on 방식을 사용할 수 있습니다. $(document).ready() 아래에 $('#id').on 코드를 넣는 식입니다.
<script>
$(document).on('click',"#testButton", function(){
alert("yup");
})
$(function(){
$("#testButton").on('click', function(){
alert("yup")
})
})
</script>
'TIL > 기타' 카테고리의 다른 글
[FB API] Facebook Login API를 http에서 개발하고 싶을 때 (0) | 2022.08.28 |
---|---|
[FB API] Uncaught ReferenceError: FB is not defined when using FB.getLoginStatus (0) | 2022.08.28 |