2020/JQuery

JQuery event.stopPropagation();

꽃꽂이하는개발자 2020. 3. 3. 18:47
반응형
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <script src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script>
      //event.stopPropagation
      // 현재 이벤트가 상위로 전달되지 않도록 중단
      $(document).ready(function() {
        $("a").click(function(event) {
          $(this).css("background-color", "orange");
          //이벤트 전파를 막음
          event.stopPropagation();
          event.preventDefault();
        });
        $("h1").click(function() {
          $(this).css("background-color", "green");
        });
      });
    </script>
    <title>Document</title>
  </head>
  <body>
    <h1>
      <a href="http://www.naver.com">Naver</a>
    </h1>
  </body>
</html>
반응형
저작자표시 (새창열림)