js에서 클릭시 실행되는 함수에 이름도 설정하는 방법
본문
제가 버튼이 클릭되면 이벤트가 처리되도록 함수를 구현했는데 이 함수에 이름을 줘서 다른때에도 호출되게 하는 방법이 없나요?
혹시 참고할만한 사이트가 있다면 링크 부탁드립니다.
$('#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;
$.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">');
}
});
}); //미리보기 출력 끝
});
답변 2
1. 동일하게 선택자 ID가 preview인경우에는 공통적으로 쓰셔도 무방합니다
2. 선택자가 계속 변경되는 경우에는 마크업에 onclick 넣으셔도 무방합니다
function preview_click() {
}
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() 를 호출하시면 됩니다만...