제이쿼리의 .click(function()안에 for문 적용 문의드립니다.
본문
<SCRIPT LANGUAGE='JAVASCRIPT'>
$(function($){
function layer_open(el){
생략.....
var layer_no = 0;
for(var I=<?=$first?>; I<<?=$last_temp?>; I++) // 1번
{
$('#layer_open_view'+layer_no).click(function(){ // 2번
alert(layer_no); // 3번
layer_open('layer_'+layer_no); /* 열고자 하는 것의 아이디를 입력 */ // 4번
});
layer_no++;
}
1번 을 보시면 for문이 있습니다. 참고로 이 for문은 총 10번 돕니다.
2번은 해당 id값을 클릭하면 즉 id값이 layer_open_view$layer_no 인 것을 클릭하게 되면
4번에서 보이는 layer_open('layer_'+layer_no); 이 함수를 실행하게 됩니다.
문제는 for문을 돌리게 되면 4번인 layer_open('layer_'+layer_no); 이 구문이 10번 안돌아가는것입니다.
클릭함수 라서 그런가요.
4번 구문도
layer_open('layer_'0);
layer_open('layer_1);
layer_open('layer_'2);
layer_open('layer_3);
이렇게 돌리고 싶은데 ㅠ,ㅠ 방법이 없는건가요? ㅠ,ㅠ
layer_no 이 변수를 이용해서 0~ 9까지 총 10번돌리지만.. 4번에 있는 것들은 for문이 적용되지 않네요 ㅠ,ㅠ
한참 고민해봐도 ㅠ,ㅠ
3번인 alert(layer_no); 출력했는데 for문 10번째인 9 다음인 10이 출력이 되네요 ㅠ,ㅠ
!-->답변 4
for (var layer_no = 0; layer_no < 10; layer_no++) {
$('#layer_open_view' + layer_no).click(function() {
layer_open('layer_' + $(this).attr('id').replace('layer_open_view',''));
});
}
제이쿼리라면. 페이지 하단에서 작동을 권장합니다.
기본적인 코딩 예제 (출처 : http://api.jquery.com/click/)
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>click demo</title>
<style>
p {
color: red;
margin: 5px;
cursor: pointer;
}
p:hover {
background: yellow;
}
</style>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<p>First Paragraph</p>
<p>Second Paragraph</p>
<p>Yet one more Paragraph</p>
<script>
$( "p" ).click(function() {
$( this ).slideUp();
});
i값이 0으로 시작하면 0~9 까지가 총 10개
i값이 1로 시작하면 1~10까지 총 10개
이렇게 됩니다
즉 1부터 하고 싶다면 1부터 시작해서 11로 끝나야 10개가 되고
0부터 시작하면 10으로 시작해야 하지요
즉 현재 구현한 for(var i=0; i<10; i++) 로 구현하면 0부터 9까지만 출력하겠지요
for(var i=1; i<=10; i++) 또는 for(var i=1; i<11; i++) 을 해야 1부터 10이 되겠지요
현재 돌아가고 있는 i값이 몇부터 시작해 몇까지 도는지 부터 확인하는게 맞는것 같습니다
'layer_'
+layer_no
이 값은 어차피 layer_no가 0부터니까요
$('#layer_open_view0').click(function(){
alert(0);
layer_open('layer_0');
});
$('#layer_open_view1').click(function(){
alert(1);
layer_open('layer_1');
});
$('#layer_open_view2').click(function(){
alert(2);
layer_open('layer_2');
});
'
'
'
'
$('#layer_open_view9').click(function(){
alert(9);
layer_open('layer_9');
});
이런 기능을 구현하시고 싶으신건가요?
그러면 이렇게 하시면 안됩니다.
자세한 내용은 해당 페이지를 봐야 답변을 드릴 수 있겠네요.