카테고리 분류 셀텍트 박스 형식 에서 궁금한게 잇어요
본문
<?php
$category_location = "./board.php?bo_table=$bo_table&sca=";
$category_option_old = get_category_option($bo_table, $sca); // SELECT OPTION 태그로 넘겨받음
?>
<form name="fcategory" method="get">
<select name=sca onchange="location='<?=$category_location?>'+this.value;">
<option value="">전체보기</option><?=$category_option_old?>
</select>
</form>
qna 검색중 찾은 소스로 기존 분류(카테고리)를 셀렉트 형식으로 넣었는데요
여기서 셀렉트 박스를 선택할때 onclick 명령을 넣고 싶습니다.
분류1
분류2
분류3
분류4
이렇게 4가지의 카테고리가 있고
분류 1을 열었을때 onclick="document.getElementById('div1').style.display='block';" 명령으로
기존에 숨겨둔 div1 를 보여지고 다른 분류를 선택하면 감춰지게 하고 싶은데
어떻게 해야 할까요?
4가지 분류 마다 보여주어야할 div는 div1 div2.. 이런 순입니다..
답변 2
다음처럼 하면 됩니다
<style>
.optk{display:none;}
</style>
<div class='optk'>111111111</div>
<div class='optk'>222222222</div>
<div class='optk'>3333333333</div>
<div class='optk'>4444444444</div>
<select name=sca onchange="$('.optk').hide().eq(this.selectedIndex).show();">
균이님. 항상 도움주셔서 감사합니다^^
균이님. 그런데 onchange 옵션에서
$('.optk').hide().eq(this.selectedIndex).show();
location='<?=$category_location?>'+this.value;
이 두가지를 같이 쓰니 location 이 안먹는데요.. 동시에 두가지 명령어를
넣을수 없나요??
다시보니 변경은 되는데요
카테고리 특성상 카테고리 변경시 새로고침이 한번 되어
해당 div 가 다시 숨겨지는것 같아요 ㅠㅠ
어떻게 방법이 없을까요?
아니면요 혹시 특정 카테고리에서만 block 되는 div 를 만들 수는 없을까요??
onchange에 location.href를 넣어버리면 페이지 이동이 되어버리니
div가 보이고 안보이고 하는 것은 아무 소용없는 처리가 되어버리죠
어떤 처리를 원하는지 알 수가 없네요
<option value="">전체보기</option><------ 이게 있군요
하여튼 div 보이고 안보이는 기능은 아래처럼 해야겠습니다
<select name=sca onchange="if(this.selectedIndex==0) $('.optk').show(); else{$('.optk').hide().eq(this.selectedIndex-1).show();} ">
답변감사합니다.
특정 카테고리에 진입시에만 보이는 div 소스가 없어서 찾던중에
셀렉트 박스로 만든 카테고리 에서
해당 카테고리로 이동할때
페이지 로드 후에도 해당 카테고리값이 select 에 남아
자동으로 선택되어디는게 저 위 소스인데요
위 소스 + 특정카테고리에 보이는 div 를 구현해보려다가
카테고리가 변경되면 페이지가 한번 새로고침되는걸 이제야 알았네요 ㅠㅠ
그래도 유용한 소스 정말 감사합니다.
그러니까 카테고리를 선택하여 새로운 카테고리로 리스트가 갱신 된 후 해당 카테고리에 해당하는
div를 보이게 하고싶다는 것이군요
이렇게 하면 됩니다
<select onchange="location~~~"><---원래 소스대로 하고
아래쪽 자바 스크립트 부분에
$(function(){
document.fcategory.sca.value='<?=$sca?>";
idx = document.fcategory.sca.selectedIndex;
if(idx ==0) $('.optk').show();
else{$('.optk').hide().eq(idx -1).show();}
});
포기하고 있었는데 고맙습니다 ㅠㅠ