테스트 사이트 - 개발 중인 베타 버전입니다

js에서 클릭시 실행되는 함수에 이름도 설정하는 방법 채택완료

Sssuj 4년 전 조회 2,257

제가 버튼이 클릭되면 이벤트가 처리되도록 함수를 구현했는데 이 함수에 이름을 줘서 다른때에도 호출되게 하는 방법이 없나요?

 

혹시 참고할만한 사이트가 있다면 링크 부탁드립니다.

 

</strong></p>

<p>$('#preview').click(function() { //미리보기 출력 시작

            $('#previewImg').html('');

            var CshowleftImg = document.getElementById("CshowleftImg").value;

            var CshowrightImg = document.getElementById("CshowrightImg").value;

            var CshowbackImg = document.getElementById("CshowbackImg").value;

            var leftImgX = document.getElementById("leftImgX").value;

            var leftImgY = document.getElementById("leftImgY").value;

            var rightImgX = document.getElementById("rightImgX").value;

            var rightImgY = document.getElementById("rightImgY").value;

            var textX = document.getElementById("textX").value;

            var textY = document.getElementById("textY").value;

            var textSize = document.getElementById("textSize").value;

            var titleText = document.getElementById("titleText").value;</p>

<p>            $.ajax({

               url: "preview.php",

               type: "POST",

               data: {

                  "CshowleftImg": CshowleftImg,

                  "CshowrightImg": CshowrightImg,

                  "CshowbackImg": CshowbackImg,

                  "leftImgX": leftImgX,

                  "leftImgY": leftImgY,

                  "rightImgX": rightImgX,

                  "rightImgY": rightImgY,

                  "textX": textX,

                  "textY": textY,

                  "textSize": textSize,

                  "titleText": titleText,

               },

               dataType: "json",

               async: false,

               cache: false,

               success: function(data, textStatus) {

                  preImg=data.preImg;

                  $('#previewImg').html("");

                  $('#previewImg').append('<img src="'+preImg+'" height="300" class="imgback">');

               }

            });

         }); //미리보기 출력 끝

      });</p>

<p><strong>

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

채택된 답변
+20 포인트

1. 동일하게 선택자 ID가 preview인경우에는 공통적으로 쓰셔도 무방합니다

2. 선택자가 계속 변경되는 경우에는 마크업에 onclick 넣으셔도 무방합니다

</p>

<p>function preview_click() {</p>

<p>}</p>

<p>

3. 정말 감싸야한다면

2번으로 내용을 감싸셔도 됩니다

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

그냥 아래처럼... document.write("그누보드"); 대신 원하는 명령어로요...

my() 라는 함수를 쉽게 부릅니다.

 

<div id=preview style=cursor:pointer>클릭</div>

<script>
function my() {
    document.write("그누보드"); // 원하는 명령어
}
preview.onclick = my;
</script>

 

-----

 

아래처럼 해도 되구요.

 

<div id=preview style=cursor:pointer>클릭</div>

<script>
function my() {
    document.write("그누보드"); // 원하는 명령어
}
preview.onclick = function() {
    my();
}

</script>

 

-----

 

아니면 아래처럼 아이디 없이도...

 

<div style=cursor:pointer onclick=my()>클릭</div>

<script>
function my() {
    document.write("그누보드"); // 원하는 명령어
}
</script>

 

-----

 

원하는 곳에 클릭, 마우스오버, 마우스아웃 등의 이벤트로 my() 를 호출하시면 됩니다만...

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인