현재페이지 주소 가져와서 css배경하기
본문
스크립트로 현재페이지 url 주소를 확인하고
그 주소라면 해당 클래스에 css를 주려고 하는데요..
<script>
$(document).ready(function() {
if(location.href.indexOf('url주소1') > -1){
$('.btn1').css('color','#882d8a');
}
if(location.href.indexOf('url주소2') > -1){
$('.btn2').css('color','#882d8a');
}
if(location.href.indexOf('url주소3') > -1){
$('.btn3').css('color','#882d8a');
}
if(location.href.indexOf('url주소4') > -1){
$('.btn4').css('color','#882d8a');
}
});
</script>
이렇게 넣었는데 url주소1 페이지에서만 클래스 btn1의 컬러만 적용되고
다른페이지로 넘어가면 클래스btn2, btn3, btn4의 컬러는 그대로입니다..
스크립트를 잘못적용한것 같은데ㅠㅠ 잘몰라서 질문올려봐요
답변 2
<script src="http://sir.kr/js/jquery-1.8.3.min.js"></script>
<script>
$(function() {
if(location.href.indexOf('test') > -1){
$('.btn1').css('color','#882d8a');
}
if(location.href.indexOf('aa') > -1){
$('.btn2').css('color','#882d8a');
}
if(location.href.indexOf('url주소3') > -1){
$('.btn3').css('color','#882d8a');
}
if(location.href.indexOf('url주소4') > -1){
$('.btn4').css('color','#882d8a');
}
});
</script>
<input type="button" class="btn1" value="버튼1" />
<input type="button" class="btn2" value="버튼2" />
<input type="button" class="btn3" value="버튼3" />
<input type="button" class="btn4" value="버튼4" />
위파일을
test.html 일때 버튼1의 색깔이 바뀌고
aa.html 일때 버튼2의 색깔이 바뀝니다.
소스상 문제는 없습니다.
스크립트 오류가 다른부분에 있는지 잘 확인해보세요.
<script>
$(document).ready(function() {
if(location.href.indexOf('url주소1') != -1){
$('.btn1').css('color','#882d8a');
}
if(location.href.indexOf('url주소2') != -1){
$('.btn2').css('color','#882d8a');
}
if(location.href.indexOf('url주소3') != -1){
$('.btn3').css('color','#882d8a');
}
if(location.href.indexOf('url주소4') != -1){
$('.btn4').css('color','#882d8a');
}
});
</script>
이렇게 한번 수정해서 적용해 보세요.