2016-07-28 5 views
0

그런 식으로 작동하는 FAQ 목록이 있습니다. 질문 (일부 텍스트)과 버튼 ("답변보기")을 포함하는 여러 개의 미니 카드가 있습니다. 버튼을 클릭하면 질문에 대한 대답이 버튼 위에 표시됩니다. 그런 다음 버튼은 "대답보기"버튼이 아니라 "닫기"버튼이어야합니다. 마지막 부분에 약간의 도움이 필요합니다.자바 스크립트를 사용하여 버튼의 텍스트를 변경 하시겠습니까?

<p>Question</p> 
<div class="collapse" id="FAQ"> 
    <div class="well"> 
     Answer to the question 
    </div> 
</div> 
<a class="btn" role="button" data-toggle="collapse" href="FAQ" aria-expanded="false" aria-controls="collapseExample">See the answer</a> 

사이드 질문 : 여기

내가 한 일이다이 목록은 내가 몇 가지 "답변을 참조/닫기 '버튼을거야 때문에, 내가 아니에요 말할 것 이드를 사용하여 작동하도록 허용 했나요?

답변

1

버튼의 텍스트를 $(".btn").innerHTML = "new text to be displayed"으로 동적으로 설정할 수 있습니다. 첫 번째 click(function() {...}) 함수에 넣으십시오.

아니요, 결코은 여러 요소에 대해 동일한 ID를 사용합니다. 클래스를 대신 사용하십시오. 한 요소에 여러 클래스를 가질 수 있습니다. 따라서 예를 들어 class="btn close"을 가지고있을 수도 있고 toggleClass("close")을 사용하여 추가하지 않을 때 추가 할 수 있습니다.

관련 문제