데이터 없을때 클릭안되게하기
본문
안녕하세요!
셀렉트박스를 선택 한후 a버튼을 클릭하면 모달창 이벤트가 발생되는 작업을 하고있는데
선택안함을 클릭했을때는 클릭할수 없게 하고싶습니다!
어떤스크립트를 추가하면 될까요 ?도움 부탁드립니다 ㅠ
<select id="selectCharge" class="form-select form-select-lg d-inline-block fs-5" style="font-size: 16px!important; width: 300px; height: 64px; margin-right: 15px; ">
<option value=" " selected>::선택 안함::</option>
<option value="옵션1">옵션1</option>
<option value="옵션2">옵션2</option>
</select>
<a class="btn btn-dark text-white toggle-text w-100 d-flex justify-content-between mb-2 mt-2 reportpage-btn" data-bs-toggle="modal" data-bs-target="#exampleModal1" data-show="reportpage-5" style="padding: 5px 24px; height: 65px;">
<div class="collapse" id="collapseExample8">
<div id="Charge_0" style="display: none; ">
</div>
<div id="Charge_1" style="display: none; ">
1
</div>
<div id="Charge_2" style="display: none;">
2
</div>
</div>
<script>
$(document).on("change", "#selectCharge", function(){
var selectedval = $(this).val();
if(selectedval == " "){
$("#Charge_0, #Charge_modal_0").css("display","block");
$("#Charge_1, #Charge_modal_1, #Charge_2, #Charge_modal_2").css("display","none");
}else if(selectedval == "옵션1"){
$("#Charge_1, #Charge_modal_1").css("display","block");
$("#Charge_2, #Charge_modal_2, #Charge_0, #Charge_modal_0").css("display","none");
}else if(selectedval == "옵션2"){
$("#Charge_2, #Charge_modal_2").css("display","block");
$("#Charge_1, #Charge_modal_1, #Charge_0, #Charge_modal_0").css("display","none");
}
$("#selectResultCharge").html(selectedval);
});
</script>
답변을 작성하시기 전에 로그인 해주세요.
