在很多情况下,我有如下复选框
<input type="checkbox" name="custom7" value="1" id="custom7"
checked="checked"> <label for="custom7">Email me more info?</label>
现在,当复选框被选中时,值应该是 1 ,如 value=1 。如果未选中该复选框,我希望该值为零,如 value=0。我怎样才能做到这一点?
在很多情况下,我有如下复选框
<input type="checkbox" name="custom7" value="1" id="custom7"
checked="checked"> <label for="custom7">Email me more info?</label>
现在,当复选框被选中时,值应该是 1 ,如 value=1 。如果未选中该复选框,我希望该值为零,如 value=0。我怎样才能做到这一点?
只是作为一个屁股并提供一个略短的答案:
$('input[type="checkbox"]').change(function(){
this.value = (Number(this.checked));
});
谢谢工作
$('#custom7').on('change', function(){
this.value = this.checked ? 1 : 0;
// alert(this.value);
}).change();
链接:http: //jsfiddle.net/WhQaR/
不要忘记bitwise XOR
运算符:
$('input[type="checkbox"]').on('change', function(){
this.value ^= 1;
});
$('input[type="checkbox"]').on('change', function(){
this.value ^= 1;
console.log( this.value )
});
<label><input type="checkbox" name="accept" value="1" checked> I accept </label>
<label><input type="checkbox" name="accept" value="0"> Unchecked example</label>
<script src="//code.jquery.com/jquery-3.3.1.min.js"></script>
这没有多大意义,因为未选中的复选框不会像评论中所说的那样发送到服务器,但是如果您需要服务器中的值,您可以使用隐藏字段:
HTML:
<input type="checkbox" value="1" id="custom7" checked="checked" />
<input type="hidden" value="1" id="hdncustom7" name="custom7" />
<label for="custom7">Email me more info?</label>
jQuery:
$('#custom7').on('change', function(){
$('#hdncustom7').val(this.checked ? 1 : 0);
});
使用此方法,您将在服务器中收到custom7
0 或 1
很简单的方法
<input type="hidden" name="is_active" value="0" />
<input type="checkbox" name="is_active" value="1" />
更改全局复选框行为方式
document.addEventListener('DOMContentLoaded', e => {
for (let checkbox of document.querySelectorAll('input[type=checkbox]')) {
checkbox.value = checkbox.checked ? 1 : 0;
checkbox.addEventListener('change', e => {
e.target.value = e.target.checked ? 1 : 0;
});
}
});
你不先尝试谷歌吗?尝试这个。
$('#custom7').change(function(){
$(this).val($(this).attr('checked') ? '1' : '0');
});
这段代码对我有用。
jQuery:
$('#custom7').on('change', function(){
var custom=$("#custom7").is(':checked')?1:0;
}