홈>
이 옵션은 버튼으로 여러 상자를 선택했습니다.
<select multiple class="form-control" onchange="selectedIds(this)" >
<option value="" onclick="selectUnselect(this)" class="btn btn-default">
option1
</option>
</select>
jQuery를 통해 클릭시 버튼 클래스를 변경합니다
$(document).ready(function () {
$(".form-control option").click(function () {
if ($(this).hasClass('btn')) {
$(this).toggleClass('btn-success');
} else {
$(this).toggleClass('btn-default');
}
});
});
선택한 옵션의 버튼 색상을 녹색으로 변경하고 싶습니다 (예 :
btn btn-success
)
btn btn-default
에서 수업
사용자가 선택한 옵션을 다시 클릭하면 초기 색상으로 돌아갑니다.
단일 옵션을 클릭해도 제대로 작동하지만 여러 옵션을 선택하면 이전 버튼의 상단 색상이 파란색으로 변합니다. 이처럼
,
라이브 앱은 다음과 같습니다 : https://i2a.herokuapp.com/app/ 설문지/만들기/
사파리에서 옵션은 버튼으로 표시되지 않지만 Chrome에서는 버튼으로 표시됩니다
이 문제를 해결하는 데 도움이 될 수 있습니까? 감사합니다.
btn btn-default
- 답변 # 1
관련 자료
- javascript - 클릭시 버튼 클래스를 변경하는 방법은 무엇입니까?
- javascript - 버튼은 색상을 변경하지 않습니다
- swiftui - Swift 클래스에서 @State var를 변경하는 방법
- dart - Flutter 버튼은 상태를 active = true에서 active = false로 변경하지 않습니다
- javascript - 리스너 또는 라디오 버튼 값 변경 JQuery v351
- Powershell/XAML의 XML 파일에서 버튼의 내용을 변경하는 방법은 무엇입니까?
- html - 라디오 버튼 외부 테두리 색상 및 두께 변경
- dart - 실룩 거리다 - 사용자 정의 클래스 위젯에서 변수를 변경하는 방법
- c++ - MFC 응용 프로그램의 도구 모음에있는 단추의 IMAGE (유형은 중요하지 않음)를 어떻게 변경해야합니까?
- javascript - addEventListener로 클래스 변경을 유지하는 방법은 무엇입니까?
- Android 스튜디오, 자바에서 클릭 할 때마다 버튼 텍스트 변경
- javascript - HTML 변경 라디오 버튼 배경
- angular - AngularJS의 다른 구성 요소에서 호출 될 때 Modal 호출 Button의 텍스트 변경
- ios - 버튼 클릭시 버튼 이미지 변경 Xcode
- reactjs - 네이티브 반응 - 내 예제에서 클래스 구성 요소를 함수 구성 요소로 변경하는 방법은 무엇입니까?
- Change Location Button Image - 위치 버튼 이미지 변경 - google maps ios sdk
- javascript - 위치에 따라 고정 위쪽 화살표 버튼의 속성을 변경하는 방법은 무엇입니까?
- reactjs - 머티리얼 UI 테마를 통해 보조 버튼 텍스트 색상 변경
- javascript - 버튼 클릭시 반응에서 변수 값을 변경하는 방법
- reactjs - react/materialui - 버튼 클릭시 케이스 변경
관련 질문
- javascript : 브라우저에서 페이지 로드 시 오디오 자동 재생
- javascript : jQuery 인라인을 어떻게 사용합니까?
- javascript : [복제] 클릭 시 버튼 색상 전환
- javascript : 버튼 클릭으로 커서를 변경하는 방법
- javascript : TypeError: data.forEach는 함수가 아닙니다.
- javascript : .click 토글 기능을 어떻게 재설정합니까?
- javascript : HTML 전화번호 유효성 검사
- javascript : jquery를 사용하여 카테고리에 따라 관련 없는 div를 페이드 아웃하는 메뉴
- javascript : html, css, js로 onclick 이벤트를 어떻게 할 수 있습니까?
- javascript : codepen.io 프로필 이미지 업로드 JQuery가 작동하지 않음
코드에서 첫 번째 조건은 항상 참입니다.
.btn
항상 요소에 있습니다. 이것을 시도하십시오 :첫 번째 클릭에서
.btn-default
를 제거합니다 수업 및.btn-success
추가 수업. 두 번째 클릭에서는 그 반대가됩니다.