我使用產生了一些自定義的複選框按http://doodlenerd.com/html-control/css-checkbox-generatorJquery的CSS複選框未檢測檢查
$(".button").click(function() {
if(document.getElementById('terms_checkbox').checked) {
alert('I am checked');
} else {
alert('I am not checked');
}
});
.button{
background:red;
width:200px
height:100px;
}
.control {
font-family: arial;
display: block;
position: relative;
padding-left: 30px;
margin-bottom: 15px;
padding-top: 3px;
cursor: pointer;
font-size: 16px;
}
.control input {
position: absolute;
z-index: -1;
opacity: 0;
}
.control_indicator {
position: absolute;
top: 0px;
left: 0;
height: 30px;
width: 35px;
background: #efe8d9;
border: 1px solid #000000;
}
.control-radio .control_indicator {
border-radius: undefined%;
}
.control:hover input ~ .control_indicator,
.control input:focus ~ .control_indicator {
background: #efe8d9;
}
.control input:checked ~ .control_indicator {
background: #EFE8D9;
}
.control:hover input:not([disabled]):checked ~ .control_indicator,
.control input:checked:focus ~ .control_indicator {
background: #efe8d9;
}
.control input:disabled ~ .control_indicator {
background: #e6e6e6;
opacity: 0.6;
pointer-events: none;
}
.control_indicator:after {
box-sizing: unset;
content: '';
position: absolute;
display: none;
}
.control input:checked ~ .control_indicator:after {
display: block;
}
.control-checkbox .control_indicator:after {
left: 10px;
top: 2px;
width: 11px;
height: 17px;
border: solid #000000;
border-width: 0 2px 2px 0;
transform: rotate(45deg);
}
.control-checkbox input:disabled ~ .control_indicator:after {
border-color: #7b7b7b;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="control-group">
<label class="control control-checkbox">
First checkbox
<input type="checkbox" />
<div class="control_indicator"></div>
</label>
</div>
<div class="button">
Click Me
</div>
當我點擊它沒有認識到複選框被選中,我要去哪裏按鈕錯誤?
_「我要去哪裏錯了嗎?」 _ - 你忽略瀏覽器控制檯的存在。所以先去看看那裏。 – CBroe
投票結束爲拼寫錯誤/無法複製。 –