스크립트 hide show 질문
본문
지역검색 부분을 아래와 같이 해보았습니다.
그런데 문제가 발생하네요.
"서울"을 클릭하면 검색은 되는데,
아래에 펼쳐질 군구가 나타났다가 바로 사라져요.
계속 펼쳐져 있어야 하는데, 어느 부분이 잘 못 되었나요?
감사합니다.
<< 아래의 경우는 군구가 펼쳐지 지만 검색이 안되고 >>
<li name="sca_do" data-val="서울" class="">서울</li>
<< 아래의 경우는 검색은 되는데 군구가 펼쳐지다가 바로 사라지는 현상 >>
<li name="sca_do" data-val="서울" class="" onclick="javascript:location.href='<?php echo G5_URL; ?>/bbs/board.php?bo_table=gooin&sca=&sfl=wr_7&stx=서울';">서울</li>
https://sir.kr/qa/462380?sfl=mb_id%2C1&lstx=imex9090
<div class="search_filter">
<form autocomplete="off”>
<p>지역선택</p>
<ul class="sca_do">
<li name="sca_do" data-val="" class="active">전국</li>
<li name="sca_do" data-val="서울" class="">서울</li>
<li name="sca_do" data-val="경기" class="">경기</li>
...
</ul>
<ol data-ol="서울" class="sca_si" style="display: none;">
<li name="sca_si" data-val="서울" class="active">전체</li>
<li name="sca_si" data-val="서울 강남구" class="">강남구</li>
<li name="sca_si" data-val="서울 강동구" class="">강동구</li>
...
</ol>
</form>
</div>
<script src="<?php echo G5_URL; ?>/jquery.min.js"></script>
<script>
$(function(){
$('[name="sca_do"]').click(function(){
$('[name="sca"]').val($(this).data('val'));
$('.sca_do li').removeClass('active');
$(this).addClass('active');
$('.sca_si li').removeClass('active');
$('.sca_si').hide();
$('[data-ol="' + $(this).data('val') + '"] li:first').addClass('active');
$('[data-ol="' + $(this).data('val') + '"]').show();
});
$('[name="sca_si"]').click(function(){
$('[name="sca"]').val($(this).data('val'));
$('.sca_si li').removeClass('active');
$(this).addClass('active');
});
$('[name="sw1"]').click(function(){
$('[name="sw1"]').val($(this).data('val'));
$('.sw1 li').removeClass('active');
$(this).addClass('active');
});
});
</script>
답변 1
<li name="sca_do" data-val="서울" class="">서울</li> 이건 열긴했는데 이동하는 코드가 없어서 그런거구요
<li name="sca_do" data-val="서울" class="" onclick="javascript:location.href='<?php echo G5_URL; ?>/bbs/board.php?bo_table=gooin&sca=&sfl=wr_7&stx=서울';">서울</li>
이건 누르니까 펼쳐지지만 곧바로 페이지 이동을 해버리니 그런겁니다.
펼치고 닫고 하는 부분과 검색 후 이동하는 부분을 별도로 만들어보세요.
$('.sca_do').click( 에서 열고닫고 하시고요
$('[name="sca_do"]').click( 에서 검색 url 이동 넣으시면 되겠어요