Как сделать input неактивным кроссбраузерно?
Здравствуйте. В форме нужно сделать несколько (не все) <input type="text"> неактивными. Сделал так:
if (document.getElementById("tb1").checked) {
document.getElementById("tbnum").disabled = false;
}
else {
document.getElementById("tbnum").disabled = true;
}
Это работает в Opera и FF, а в Chrome и IE нет. А как сделать, чтобы было кроссбраузерно? |
nraw, в IE 8 и Chrome 20 все робит...
<html>
<head>
<title></title>
<script>
function a() {
if (document.getElementById("tb1").checked) {
document.getElementById("tbnum").disabled = false;
}
else {
document.getElementById("tbnum").disabled = true;
}
}
</script>
</head>
<body>
<input type="checkbox" value="asd" id="tb1" onClick="a()">
<input type="text" id="tbnum">
</body>
</html>
|
Наверно, я не полностью сформулировал вопрос. В Chrome и IE сразу после загрузки страницы чекбокс не выделен и поле для текста активно, по крайней мере у меня именно так. Поле <input type="text"> становится неактивным, если поставить, а затем снять галочку.
Может я что-то не так делаю? Подскажите... |
nraw,
<script type="text/javascript">
function ONNnclick(){
if (document.getElementById("tb1").checked) {// alert("A")
document.getElementById("tbnum").disabled=false;
}
else {
document.getElementById("tbnum").disabled=true;
}
}
</script>
<input id="tb1" type="checkbox" checked="false" onclick="ONNnclick()" autocomplete="off"/>
<input id="tbnum" type="text" value="Тра-та-та"/>
<script type="text/javascript">
document.getElementById("tb1").click()
</script>
|
Цитата:
<html>
<head>
<title></title>
<script>
function a() {
if (document.getElementById("tb1").checked) {
document.getElementById("tbnum").disabled = false;
}
else {
document.getElementById("tbnum").disabled = true;
}
}
</script>
</head>
<body>
<input type="checkbox" value="asd" id="tb1" onClick="a()">
<input type="text" id="tbnum">
<script>window.onload = a;</script>
</body>
</html>
либо так (18 строка), либо нарисуйте атрибут disabled у текстового поля изначально... |
Спасибо, получилось с атрибутом disabled.
|
Еще возник вопрос. Если я таким образом пытаюсь включить несколько подряд инпутов, то это не работает. При этом работает, если ставить галки начиная от последнего элемента к первому по порядку. Работает только отдельно какой-либо из выбранных, а остальные неактивны. Как это реализовать?
|
<div>
<input type="checkbox">
<input disabled>
<input disabled>
<input disabled>
</div>
<div>
<input type="checkbox">
<input disabled>
<input disabled>
<input disabled>
</div>
<script>
window.onload = function () {//onload begin
document.body.onclick = function (e) {//onclick begin
e = e || event;
var target = e.target || e.srcElement;
if (target.type == 'checkbox') {
var inp = target.parentNode.children;
var len = inp.length;
if (target.checked == true) {
for (var i = 1; i < len; i++) {
inp[i].disabled = false;
}
} else {
for (var i = 1; i < len; i++) {
inp[i].disabled = true;
}
}
}
}//onclick end
}//onload end
</script>
|
У меня элементы input находятся в ячейках таблицы
<table> <tr><td>Название</td><td>Значение</td><td>Количество</td></tr> <tr> <td> <p><input type="checkbox" value="tb1" id="tb1"></p> </td> <td> <p><input type="text" id="tb1val" disabled></p> </td> <td> <p><input type="checkbox" value="num1" id="num1"><input type="text" id="tbnum1" disabled></p> </td> </tr> <tr> <td> <p><input type="checkbox" value="tb2" id="tb2"></p> </td> <td> <p><input type="text" id="tb2val" disabled></p> </td> <td><p><input type="checkbox" value="num2" id="num1"><input type="text" id="tbnum2" disabled></p> </td> </tr> </table>поэтому код не работает, а точнее работает частично (только в колонке "Количество"). Если я правильно понял, не работают эти строки?
var inp = target.parentNode.children;
var len = inp.length;
|
elem.setAttribute('disabled', 'disabled'); // сделать неактивной
elem.removeAttribute('disabled'); // сделать активной
// кроссбраузерно
|
| Часовой пояс GMT +3, время: 10:42. |