#php #html #jquery #checkbox
Вопрос:
Я пытаюсь получить значения флажков, которые я проверяю, и поместить их в переменную php, но когда я вывожу это значение, оно дает мне нули (0). Если я поставлю 3 флажка, я получу три нуля и т. Д. Информация: Я хочу, чтобы каждый флажок был установлен, поэтому, если установлены флажки cb1 и cb3, я хочу, чтобы переменная была «cb1cb3».
HTML-код:
<div class="form-label-group">
<h2 for="checkboxes">
Some text
</h2>
<input type="checkbox" id="cb1" onclick="click()" name="cb[]" value="cb1"><label for="cb1">cb1</label><br>
<input type="checkbox" id="cb2" onclick="click()" name="cb[]" value="cb2"><label for="cb2">cb2</label><br>
<input type="checkbox" id="cb3" onclick="click()" name="cb[]" value="cb3"><label for="cb3">cb3</label><br>
</div>
Код JS/php:
function click(){
$("input[name='cb[]']:checked").each(function ()
{
cb =$(this).text();
//also tried to put a $ sign in front of the cb variable: $cb =$(this).text();
//and with val instead of text: $cb =$(this).val();
i ;
});
}
Надеюсь, вы сможете мне помочь
Ответ №1:
Всегда рекомендуется разделять JS и HTML, не используя встроенные JS. Также я бы использовал change
событие и .map()
метод следующим образом:
$('input[name="cb[]"]').on('change', function() {
const checkedVals = $('input[name="cb[]"]:checked').map((i,c) => c.value).get();
console.log( checkedVals ); //array
console.log( checkedVals.join('') ); //strings: values concatenated
});
ДЕМОНСТРАЦИЯ
$(function() {
$('input[name="cb[]"]').on('change', function() {
const checkedVals = $('input[name="cb[]"]:checked').map((i,c) => c.value).get();
console.log( checkedVals );
console.log( checkedVals.join('') );
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="form-label-group">
<h2 for="checkboxes">
Some text
</h2>
<input type="checkbox" id="cb1" name="cb[]" value="cb1"><label for="cb1">cb1</label><br>
<input type="checkbox" id="cb2" name="cb[]" value="cb2"><label for="cb2">cb2</label><br>
<input type="checkbox" id="cb3" name="cb[]" value="cb3"><label for="cb3">cb3</label><br>
</div>
Ответ №2:
Попробуй это
<div class="form-label-group">
<h2 for="checkboxes">
Some text
</h2>
<input type="checkbox" id="cb1" name="cb[]" value="cb1"><label for="cb1">cb1</label><br>
<input type="checkbox" id="cb2" name="cb[]" value="cb2"><label for="cb2">cb2</label><br>
<input type="checkbox" id="cb3" name="cb[]" value="cb3"><label for="cb3">cb3</label><br>
</div>
<script>
$("input[name='cb[]']").on("click", (e) =>{
let cb="";
$("input[name='cb[]']:checked").each(function ()
{
cb =$(this).val();
// i ;
});
console.log(cb);
});
</script>
Я заменяю ваш флажок html …onclick=»нажмите()»… по
$("input[name='cb[]']").on("click", (e) =>
затем в js я добавил let cb = ""
значение для сброса при новом событии щелчка
cb =$(this).text()
изменение на cb =$(this).val();
причину $(this).text()
ничего не вернуло в console.log
Комментарии:
1. Я заменяю … onclick=»щелчок()»… по
$("input[name='cb[]']").on("click", (e) =>
в js, затем я добавил ` let cb = «»` для сброса значения при событии щелчка и для завершенияcb =$(this).text()
изменения, чтобыcb =$(this).val();
вызвать $(this).text() ничего не вернул в console.log2. На вводе нет текста…. Текст есть на этикетке.