jquery에서 on()과 click()의 차이점은 무엇입니까?
- 青灯夜游원래의
- 2020-11-19 09:58:572004검색
차이점: 1. [click()]은 페이지가 로드될 때 새로 추가된 요소에 대해 클릭 이벤트가 더 이상 추가되지 않습니다. 2. [on()]은 페이지가 로드될 때 적용됩니다. 로드된 경우 새 요소에 대한 클릭 이벤트를 추가할 수 있지만, 상위 요소를 선택해야 합니다.
관련 권장사항: "jQuery Tutorial"
jquery
click()에서 on()과 click()의 차이점은 static에 속합니다. 페이지가 로드되면 새로 추가된 요소에 대한 클릭 이벤트가 더 이상 추가되지 않습니다.click()属于静态加载，当页面加载完，就不在为新增加的元素添加点击事件。on()
on()은 페이지가 로드될 때 새로 추가된 요소에 대한 이벤트를 추가할 수 있지만 상위 요소를 선택해야 합니다.
정적 컨트롤을 바인딩할 때는 둘 사이에 차이가 없지만, 동적으로 생성된 컨트롤이 있는 경우 on()만 동적 컨트롤에 성공적으로 바인딩할 수 있습니다. <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="https://cdn.staticfile.org/jquery/2.2.4/jquery.min.js"></script>
</head>
<body>
<h1>展示jQuery中on()和click()的区别</h1>
<p>
<span>点击生成新按钮。NewOn生成的Delete按钮行为用on()实现，NewClick生成的Delete按钮行为用click()实现。</span>
</p>
<div class="test">
<button class="new" id="newon">NewOn</button>
<button class="new" id="newclick">NewClick</button>
<ul class="li">
<li>原先的HTML元素on<button class="deleteon">Delete</button></li>
<li>原先的HTML元素click<button class="deleteclick">Delete</button></li>
</ul>
</div>
</body>
<script type="text/javascript">
$("#newclick").click(function(){
$(".li").append('<li>动态添加的HTML元素click<button class="deleteclick">Delete</button></li>');
});
$("#newon").click(function(){
$(".li").append('<li>动态添加的HTML元素on<button class="deleteon">Delete</button></li>');
});
$(".delete").click(function(){
$(this).parent().remove();
});
$(".li").on('click', ".deleteon", function(){
$(this).parent().remove();
})
$(".deleteclick").click(function(){
$(this).parent().remove();
});
</script>
</html>더 많은 프로그래밍 관련 지식을 보려면 🎜프로그래밍 교육🎜을 방문하세요! ! 🎜위 내용은 jquery에서 on()과 click()의 차이점은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.