2015-01-21 5 views
2

사용자가 클릭 할 때 다른 버튼의 색상을 변경하려면 버튼을 사용하고 있습니다. 그러나 알 수없는 몇 가지 이유 때문에 작동하지 않습니다. 제발 도와주세요.토글 클래스가 작동하지 않습니다.

<!DOCTYPE html> 
<html> 
<head> 
    <title>My Gallery</title> 
    <!-- Bootstrap --> 
    <link href="css/bootstrap.min.css" rel="stylesheet"> 
    <link href="css/custom.css" rel="stylesheet"> 
</head> 
<body> 
    <div class="container"> 
     <p id="btn1" class="btn btn-primary">Click me!</p> 
     <p id="btn2" class="btn btn-default">Change color!</p> 
    </div> 

    <!-- Javascript --> 
    <script src="js/jquery-2.1.3.js"></script> 
    <script src="js/bootstrap.min.js"></script> 

    <script> 
     var main = function() { 
      $("#btn2".click(function() { 
       $("#btn1").toggleClass(".btn-primary"); 
      }); 
     } 

     $(document).ready(main); 
    </script> 
</body> 
</html> 
+1

이와 함께 주요 기능을 대체 콘솔 – Seth

+0

을 확인하십시오.. VAR 주 = 함수() { $ ("#의 btn2")을 클릭 (함수() { $ ("#의 인 btn1") toggleClass (function() { return "btn-primary"; }); }); } toggleClass-method에 함수를 전달할 수 있습니다. – Blauharley

답변

3

"." (당신이 선택에서하는 것처럼) 클래스 이름 앞에 :

$("#btn1").toggleClass("btn-primary"); 
+0

아직 작동하지 않습니다. 나는 그것을 다음과 같이 변경했다 : $ ("# btn1"). toggleClass ('btn-primary'); – Cartoon

1

이 :

$("#btn2".click(function() { 

은 다음과 같아야합니다

$("#btn2").click(function() { 

공지 사항 닫는 괄호 당신의 "#의 btn2 후 "선별 자.

다른 사람들도 지적했듯이 토글되는 클래스 이름의 시작 부분에서 마침표를 제거해야합니다. 콘솔에 오류가 있는지 확인해야합니다.

+0

여전히 "." 유모차에서 –

+0

오! 바보 나. 고맙습니다. :) 당신은 생명의 은인입니다. – Cartoon

1

이렇게 표시됩니다.

$("#btn2").click(function() { 
    $("#btn1").toggleClass("btn-primary"); 
}); 
+0

그래서 코드의 차이점은 btn-primary 이전의 기간을 없애는 것입니까? – Dijkgraaf

+0

예 및 선택기에서 누락 된 ")" –

관련 문제