슈가
51
2020-11-21 20:03:43
5
108

이미지 하나에 이벤트를 두개 넣을 수 있나요?


이미지를 한 번 눌러서 이벤트 1을 실행하고,

동일한 이미지를 한 번 더 눌러서 이벤트 2를 실행할 수 있나요?

페이지 이동 없이 같은 페이지에서요.


html css javascript jsp 사용중입니다.

0
  • 답변 5

  • dlalskwk2
    386
    2020-11-21 20:11:40



    
    var a = document.getElementByid();
    var count =0;
    
    a한번 클릭할때 count +1 해주고
    한번 더클릭하면 +1 해서
    
    count가 1일때 이벤트
    count가 2일때 이벤트
    
    처리해주면 될거같아요
    


  • Bjork
    16
    2020-11-21 20:38:42

    의도가 이게맞는건진 모르겠는데

    <div id="id명"><img onclick=이벤트1() ~~ ></div> 한다음에

    <script>

    var id명 = document.getElementById("id명");

    function 이벤트1(){

    id명.innerHTML =  "<img onclick=이벤트2() ~~쓰고" >;

    }


    fucction 이벤트2(){내용}

    </script>


    하면 되지 않을까요??src는 똑같이 쓰시고 초기화하실거면

    이벤트2내용마지막에 id명.innerHTML=  "<img onclick=이벤트1() ~~" >; 쓰구요

  • 슈가
    51
    2020-11-21 21:06:33


    <script>
    function event1() {
            	document.getElementById("idid").onclick = "javascript:event2()";
            	document.getElementById("idid").src = "icon/voice.png";
            	내용~~~
    }
    function event2() {
            	내용~~~
    }
    </script>
    <img id="idid" src="icon/voice_92.png" onclick="javascript:event1()">
                

    이렇게 했는데 src는 변경이 되어서 이미지는 바뀌는데 onclick은 안바뀌는 건 왜인가요?

  • Bjork
    16
    2020-11-21 21:18:05

    위코드는 클릭하면 이미지바뀌는게맞고, event2가 실행된다는내용같은데요..?

    처음클릭할땐 event1,두번째클릭땐  event2를 실행하고싶으신거아닌가요?

    그럼 img를 div로감싸고 그div에 innerHTML로 onclick을 event2로 바꿔주시면 될거같아요

  • 제관공
    53
    2020-11-22 01:40:19

    첫번째 함수의 `document.getElementById('idid').onclick = event2` 로 해주시면 됩니다.

    script안의 내용은 javascript 문법을 따르기 때문에 dom element의 property를 넣어주듯이 저렇게 스트링을 넣어주면 안돼요.

  • 로그인을 하시면 답변 을 등록할 수 있습니다.