だから私は次のようなコードを持っています:
<input class="messageCheckbox" type="checkbox" value="3" name="mailId[]">
<input class="messageCheckbox" type="checkbox" value="1" name="mailId[]">
現在チェックされているチェックボックスの値を取得するには、Javascriptが必要です。
編集:追加するには、チェックボックスが1つしかありません。
だから私は次のようなコードを持っています:
<input class="messageCheckbox" type="checkbox" value="3" name="mailId[]">
<input class="messageCheckbox" type="checkbox" value="1" name="mailId[]">
現在チェックされているチェックボックスの値を取得するには、Javascriptが必要です。
編集:追加するには、チェックボックスが1つしかありません。
上記のどれも私にとってはうまくいきませんでしたが、単にこれを使用してください:
document.querySelector('.messageCheckbox').checked;
最新のブラウザの場合:
var checkedValue = document.querySelector('.messageCheckbox:checked').value;
を使用してjQuery:
var checkedValue = $('.messageCheckbox:checked').val();
なしの純粋なJavaScriptjQuery:
var checkedValue = null;
var inputElements = document.getElementsByClassName('messageCheckbox');
for(var i=0; inputElements[i]; ++i){
if(inputElements[i].checked){
checkedValue = inputElements[i].value;
break;
}
}
コードでこれを使用しています。これを試してください
var x=$("#checkbox").is(":checked");
チェックボックスがオンの場合はxtrue になり、それ以外の場合は false になります。
プレーンJavaScriptで:
function test() {
var cboxes = document.getElementsByName('mailId[]');
var len = cboxes.length;
for (var i=0; i<len; i++) {
alert(i + (cboxes[i].checked?' checked ':' unchecked ') + cboxes[i].value);
}
}
function selectOnlyOne(current_clicked) {
var cboxes = document.getElementsByName('mailId[]');
var len = cboxes.length;
for (var i=0; i<len; i++) {
cboxes[i].checked = (cboxes[i] == current);
}
}
$(document).ready(function() {
var ckbox = $("input[name='ips']");
var chkId = '';
$('input').on('click', function() {
if (ckbox.is(':checked')) {
$("input[name='ips']:checked").each ( function() {
chkId = $(this).val() + ",";
chkId = chkId.slice(0, -1);
});
alert ( $(this).val() ); // return all values of checkboxes checked
alert(chkId); // return value of checkbox checked
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<input type="checkbox" name="ips" value="12520">
<input type="checkbox" name="ips" value="12521">
<input type="checkbox" name="ips" value="12522">
これを使って:
alert($(".messageCheckbox").is(":checked").val())
これは、チェックするチェックボックスにクラス「messageCheckbox」があることを前提としています。そうでない場合は、入力がチェックボックスタイプであるかどうかをチェックする必要があります。
純粋な JavaScript と最新のブラウザ
// for boolean
document.querySelector(`#isDebugMode`).checked
// checked means specific values
document.querySelector(`#size:checked`)?.value ?? defaultSize
<form>
<input type="checkbox" id="isDebugMode"><br>
<input type="checkbox" value="3" id="size"><br>
<input type="submit">
</form>
<script>
document.querySelector(`form`).onsubmit = () => {
const isDebugMode = document.querySelector(`#isDebugMode`).checked
const defaultSize = "10"
const size = document.querySelector(`#size:checked`)?.value ?? defaultSize
// for defaultSize is undefined or null
// const size = document.querySelector(`#size:checked`)?.value
console.log({isDebugMode, size})
return false
}
</script>