<HTML> 부분
<li>
<label>
<input type="radio" class="ins-radio" name="ra1">
<div id="detailOP3" name="detailOP3" class="oppayA">
<p class="t1"><span class="choiceop">파킹 어시스트<br>
가솔린 3.3 선택시 선택가능</span></p>
<p class="t2">
<strong class="oppay">2,000,000원</strong>
</p>
</div>
</label>
<em class="tipOpen"></em>
<div class="tooltipWrap">
<div class="tooltip">
전방충돌방지 보조<br>
고속도로 주행보조<br>
내비게이션 기반 스마트크루즈컨트롤
</div>
</div>
</li>스크립트 부분
$(function(){
// 선택옵션 - 툴팁오픈 이벤트(클릭시 툴팁오픈) 20210705
$(".lowCredit .tipOpen").on("click",function(){
if($(this).hasClass("active")){
$(this).removeClass("active");
}else{
$(".lowCredit .tipOpen").removeClass("active");
$(this).addClass("active");
}
return false;
});
});THML 은 자동차 옵션 리스트(동적) 이고
코드는 class=tipOpen 부분이 클릭하면 display none에서 inline 으로 바뀌는 간단한 코드다
(active 클래스를 부여하면 보이고 아니면 사라짐)
리스트가 동적이다 보니 ajax 로 데이터를 받고<li>태그 안쪽을
.empty(); 지우고 다시
.append(); 로 채우는 스크립트로 리스트를 뽑아왔는데 팁 부분 스크립트가 동작하지 않았다
펑션에 (document).ready 도 달아보고 이것저것 해보다가 결국
function Tipfunc(){
// 선택옵션 - 툴팁오픈 이벤트(클릭시 툴팁오픈) 20210705
$(".lowCredit .tipOpen").on("click",function(){
if($(this).hasClass("active")){
$(this).removeClass("active");
}else{
$(".lowCredit .tipOpen").removeClass("active");
$(this).addClass("active");
}
return false;
});
};
이런식으로 Tipfunc 으로 이름을 달고 리스트를 뽑아오는 스크립트에 넣어줘서 동작시켜 해결했다.
'꿀팁 활용 > 메모정리' 카테고리의 다른 글
| [nginx] config.d (0) | 2024.12.20 |
|---|---|
| 인텔리제이 try catch 문 단축기 (0) | 2022.11.17 |
| 자바 참고자료 (0) | 2022.09.21 |
| 서버 사양변경시 신경써야 할것 (0) | 2022.08.26 |
| 같은 내부망 모바일에서 웹서버 접속오류 해결방법 (0) | 2022.08.24 |
