HTML checkbox onclick, вызванный в Javascript

У меня есть немного проблем, пытаясь понять, как заставить часть моего кода работать.

<input type="checkbox" id="check_all_1" name="check_all_1" title="Select All" onclick="selectAll(document.wizard_form, this);">
<label for="check_all_1" onclick="toggleCheckbox('check_all_1'); return false;">Select All</label>

Это мой HTML, который работает так, как должен (щелчок по тексту щелкнет по полю). Javascript для этого довольно просто:

function toggleCheckbox(id) {
    document.getElementById(id).checked = !document.getElementById(id).checked;
}

Однако я хочу, чтобы onclick выполнялся для ввода, когда метка - это то, что делает этот флажок. В это текущее время onClick js не идет. Что такое одно предложение о том, как это сделать? Я попытался добавить onclick ввода в onclick метки, но это не сработает.

Любые предложения/решения были бы замечательными.

Ответ 1

Как добавить checkbox в label, сделав метку автоматически "чувствительной к клику" для этого флажка, и поставьте флажок a onchange event?

<label ..... ><input type="checkbox" onchange="toggleCheckbox(this)" .....> 

function toggleCheckbox(element)
 {
   element.checked = !element.checked;
 }

Это дополнительно поймает пользователей с помощью клавиатуры, чтобы переключить флажок, что-то onclick не будет.

Ответ 2

Ярлык без onclick будет вести себя так, как вы ожидали. Он меняет ввод. То, что вы хотите, это выполнить selectAll(), когда вы нажимаете на метку, правильно? Затем добавьте только выделение на метку onclick. Или заверните ввод в метку и назначьте onclick только для метки

<label for="check_all_1" onclick="selectAll(document.wizard_form, this);">
  <input type="checkbox" id="check_all_1" name="check_all_1" title="Select All">
  Select All
</label>

Ответ 3

jQuery имеет функцию, которая может это сделать:

включить в голову следующие script:
```
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>
```
(или просто загрузите файл jQuery.js онлайн и включите его локально)

используйте этот script для переключения флажка при нажатии на вход:

var toggle = false;
$("#INPUTNAMEHERE").click(function() {
        $("input[type=checkbox]").attr("checked",!toggle);
        toggle = !toggle;
});

Это должно делать то, что вы хотите, если я понял, что вы пытаетесь сделать.

Ответ 4

Вы также можете извлечь код события из HTML, например:

<input type="checkbox" id="check_all_1" name="check_all_1" title="Select All" />
<label for="check_all_1">Select All</label>

<script>
function selectAll(frmElement, chkElement) {
    // ...
}
document.getElementById("check_all_1").onclick = function() {
    selectAll(document.wizard_form, this);
}
</script>