Две одинаковые зависимые html-формы на странице
Всем доброго дня!
Подскажите, пожалуйста, есть ли решение. На одной странице расположены две одинаковые формы с выпадающим списком и радио-кнопкой. Можно ли сделать так, чтобы при выборе данных в одной форме, вторая форма одновременно принимала такие же значения? <select class="" name="param1" > <option value="0" selected="selected">параметр 1</option> <option value="1">параметр 2</option> <option value="2">параметр 3</option> <option value="3">параметр 4</option> </select> <input name="param2" type="radio" value="1"> <input name="param2" type="radio" value="2"> |
Цитата:
|
Цитата:
|
пример для селектов. Для инпутов я думаю вы и сами сделаете)
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="Keywords" content="">
<meta name="description" content="">
<title>ГГ</title>
<style>
*{
margin:0;
padding:0;
outline: 0;
}
select {
margin: 30px;
}
</style>
</head>
<body>
<select id="select1">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
<select id="select2">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
<script>
var select1 = document.getElementById('select1');
select1.onchange = function(){
var value = select1.value;
var selector = "#select2 option[value='"+value+"']";
var last = document.querySelector("#select2 option[selected='selected']");
if (last)
last.setAttribute('selected','false');
document.querySelector(selector).setAttribute('selected','selected');
}
</script>
</body>
</html>
|
EmperioAf, большое спасибо, очень выручили.
|
| Часовой пояс GMT +3, время: 15:16. |