Radio как сделать неактивной в зависимости от другого radio?
У меня есть к примеру 2 radio
<input type="radio name="first" value="no""> ручная <input type="radio name="first" value="yes"> автоматическая И далее есть список тоже из них <input type="radio name="sec" value="1""> <input type="radio name="sec" value="2"> и тд до 50 допустим А так же есть текстовый <input type="text" name="third" > Нужно чтобы прямо на странице делало если в начале тыкнул ручную то далее где name sec становится неактивной, а текстовый ввод активным, при нажатии на автомат наоборот уже, через script как можно сделать? |
$('[name="first"]').change(function(){
var $t=$(this);
if(!$t.prop('checked'))
return;
$('[name="sec"],[name="third"]').attr('disabled',true);
$('[name="'+($t.val()=='no'?'third':'sec')+'"]').removeAttr('disabled');
});
|
GTMichael,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(function() {
var f = $('[name="first"]'), r = $('[type="radio"]').not(f), n = $('[name="third"]');
f.on("click", function() {
var no = this.value == "no";
r.each(function(indx, el){
no ? $(el).prop({disabled : true, checked : false}) : $(el).removeAttr("disabled")
});
n.prop({disabled : !no})
})
});
</script>
</head>
<body>
<input type="radio" name="first" value="no"> ручная
<input type="radio" name="first" value="yes"> автоматическая
<input type="radio" name="sec" value="1">
<input type="radio" name="sec" value="2">
<input type="text" name="third" disabled="disabled">
</body>
</html>
|
<html>
<head>
</head>
<body>
<input type="radio" name="first" value="no"> ручная
<input type="radio" name="first" value="yes"> автоматическая
<input type="radio" name="sec" value="1">
<input type="radio" name="sec" value="2">
<input type="text" name="third" >
<script>
document.body.onchange=function(){
[].forEach.call(document.querySelectorAll('input[name="sec"]'), function(el){
el.disabled = document.querySelector('input[value="no"]').checked;
});
document.querySelector('input[name="third"]').disabled = document.querySelector('input[value="yes"]').checked;
};
</script>
</body>
</html>
|
| Часовой пояс GMT +3, время: 22:59. |