Bootstrap의 btn-group에서 버튼을 사전 전환하려면 어떻게해야합니까?

Bootstrap의 btn-group에서 버튼을 사전 전환하려면 어떻게해야합니까?

---

라디오 버튼 그룹을 배포하고 버튼 중 하나를 미리 전환하려면 어떻게해야합니까?

요일 값이있는 라디오 버튼 그룹이 있습니다. 이 하나:

<div class="btn-group" data-toggle="buttons-radio">
  <button class="btn" id="test0">Mon</button>
  <button class="btn" id="test1">Tue</button>
  <button class="btn" id="test2">Wed</button>
  <button class="btn" id="test3">Thu</button>
  <button class="btn" id="test4">Fri</button>
  <button class="btn" id="test5">Sat</button>
  <button class="btn" id="test6">Sun</button>
</div>

내가 필요한 것은 현재의 일 값 (사용 가져 오기하는 것입니다 var currentDay = new Date().getDay())와 toggle그룹의 (활성화) 해당 버튼을 누릅니다.

그리고 다음 코드로 토글하려고합니다 (테스트 목적으로).

$("#test0").button('toggle')

이것은 작동하지 않습니다.

---

부트 스트랩 .btn.active클래스를 활용하여 먼저 토글하려는 버튼에 추가하고 jQuerys toggleClass 를 사용하여 버튼을 토글 해제 할 수 있습니다 . 데모 .

---

트위터에이 효과를 호출 할 수있는 버튼 스크립트가 있다는 것을 알았습니다. 여기 예상했던 결과 가 포함 된 고정 데모 가 있습니다.

---

댓글에서 실제로 원하는 것을 확인한 후 찾고있는 결과로 바이올린을 업데이트했습니다.

getDay배열에서 자바 스크립트 메서드를 사용하여 현재 날짜를 가져 오고 버튼의 ID를 대상으로 지정하여 버튼 그룹에서 해당 날짜를 전환 하는 함수를 추가했습니다 . demo

관련 코드 :

JS

function today() {
    var arr = ["0", "1", "2", "3", "4", "5", "6"]; //first day of the week is sunday and its index is 0
    var currentDay = new Date().getDay();

    return (arr[currentDay]);
}

var day = '[id="test' + today() +'"]'; // we take the current day from the array and add the beginning of the class name and save it in a variable

$(day).button('toggle');

---

위의 방법을 시도했지만 HTML / CSS 솔루션 만 원했습니다.

포커스 기반 접근 방식이 부트 스트랩 3에서 작동 한다는 것을 알았습니다 . 자동 포커스 는 HTML5 속성 입니다.

<div class="btn-group">
      <button class="btn" id="test0" autofocus="true">Mon</button>
      <button class="btn" id="test1">Tue</button>
      <button class="btn" id="test2">Wed</button>
      <button class="btn" id="test3">Thu</button>
      <button class="btn" id="test4">Fri</button>
      <button class="btn" id="test5">Sat</button>
      <button class="btn" id="test6">Sun</button>
</div>

내가 찾을 수 Bootply는 부트 스트랩과 바이올린을위한 쉽습니다.
내 테스트 bootply는 다음과 같습니다. http://www.bootply.com/cSntVlPZtU

---

페이지로드시 클릭되는 버튼을 가장합니다.

$ ( "# buttonid"). trigger ( "클릭");

페이지로드시 클릭 한 것으로 표시하고 싶은 또 다른 유사한 표준 버튼을 위해 작업했습니다. 표시하려는 페이지 기본 테이블보기를 설정하려면 버튼 동작이 필요했습니다. 다른 버튼은 다른보기를 제공하지만 기본 버튼은 모든 데이터를 표시합니다.

---

나는 같은 문제가 발생했지만 더 간단한 해결책을 원했습니다. 나는 클래스에 "active"를 추가해도 문제가 해결되지 않는다는 것을 알아 챘다. 어떻게 든 제거 되었기 때문이다. (왜 이런 일을하는지 조사하지 않았다).

솔루션은 클래스에 "활성 활성"을 추가합니다. 이렇게하면 하나만 제거되고 다른 하나는 뒤에서 일어나는 마법을 우회합니다. 정말 더러운 솔루션이지만 문제를 해결합니다. 도움이 되었기를 바랍니다.

참고 URL : https://stackoverflow.com/questions/9551628/how-can-i-pre-toggle-a-button-in-bootstraps-btn-group