Выбор только 1 значения chexbox
Здравствуйте. На странице стоит несколько checkbox. Как сделать так, чтобы пользователь мог выбрать только одно значение(мог поставить только 1 галочку), а если он выбрал 1 checkbox на других бы галочки убирались (checkbox около 100)
|
var handler = function ( event ){
event = event || window.event;
var target = event.target || event.srcElement;
if ( target.nodeType == 1 && target.nodeName.toLowerCase == "input" && target.type == "checkbox" && target.checked ) {
var inputs = document.getElementsByTagName("input");
for ( var i = 0; inputs[i]; i++ ) {
if ( inputs[i].type="checkbox" && inputs != target ) {
inputs[i].checked = false;
}
}
}
}
if (document.body.addEventListener){
document.body.addEventListener('click', handler, false);
} else if (document.body.attachEvent){
document.body.attachEvent('onclick', handler);
}
|
скажите а как использовать?
я вставил этот скрипт между <script></script>, но галки все равно ставятся |
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<ol>
<li><input type="checkbox" name="" id=""/></li>
<li><input type="checkbox" name="" id=""/></li>
<li><input type="checkbox" name="" id=""/></li>
<li><input type="checkbox" name="" id=""/></li>
<li><input type="checkbox" name="" id=""/></li>
<li><input type="checkbox" name="" id=""/></li>
<li><input type="checkbox" name="" id=""/></li>
<li><input type="checkbox" name="" id=""/></li>
<li><input type="checkbox" name="" id=""/></li>
<li><input type="checkbox" name="" id=""/></li>
</ol>
<script type="text/javascript">
var handler = function ( event ){
event = event || window.event;
var target = event.target || event.srcElement;
if ( target.nodeType == 1 && target.nodeName.toLowerCase() == "input" && target.type == "checkbox" && target.checked ) {
var inputs = document.getElementsByTagName("input");
for ( var i = 0; inputs[i]; i++ ) {
if ( inputs[i].type == "checkbox" && inputs[i] != target ) {
inputs[i].checked = false;
}
}
}
}
if (document.addEventListener){
document.addEventListener('click', handler, false);
} else if (document.attachEvent){
document.attachEvent('onclick', handler);
}
</script>
</body>
</html>
|
спасибо. изините за нескромность, но последний вопрос:
к примеру есть несколько chexbo: chexbox0 chexbox1 chexbox2 chexbox3 ..... chexboxN как сделать так, чтобы при нажатии на chexbox0 с остальных chexbox галочка снималась, а при нажатии на любой другой, снималась галочка с chexbox0 ? |
Цитата:
|
<div>
<input id="chexbox0" type="checkbox" onClick="selCheckbox(this);"/>
<input id="chexbox1" type="checkbox" onClick="selCheckbox(this);"/>
<input id="chexbox2" type="checkbox" onClick="selCheckbox(this);"/>
<input id="chexbox3" type="checkbox" onClick="selCheckbox(this);"/>
</div>
<script>
function selCheckbox(obj)
{
var parent = obj.parentNode;
if (obj.id != 'chexbox0')
parent.getElementById('checkbox0').checked = false;
else
{
var checks = parent.getElementsByTagName('input');
for(var i in checks)
{
if (checks[i].id != obj.id)
checks[i].checked = false;
}
}
}
</script>
но данный скрипт позволяет выбирать все значения, а мне нужно, чтобы при выборе любого другого chexbox, кроме chexbox0, с chexbox0 убиралась галочка (checked = false). Но как это сделать? |
Цитата:
|
это любому понятно. но я спрашиваю не потому, что не знаю алгоритма, а потому, что непонятен процесс реализации(((
|
Amateur, это букварская задачка. Её дают сааамым новичкам при изучении языка и ДОМ-модели... Что именно в ней может быть не понятно?
Как работать с элементами и всё нужное из js есть в твоём же примере. |
| Часовой пояс GMT +3, время: 15:00. |