Просмотр полной версии : Помогите с соседним элементом
День добрый!
Есть поле инпут типа текст. Перед ним идет три селекта с кнопкой в конце. Необходимо, чтобы по нажатию на кнопку в этот самый инпут вписывались значения, взятые из селектов.
задача осложняется тем, что таких инпутов, куда нужно вставлять, может быть несметное множество и с одинаковым именем...((
Вопрос: как яве объяснить, что нужно вставлять именно в тот инпут, который идет за кнопкой?
liber87,
Пользуемся Только ява-скрипт ?
lord2kim
20.07.2012, 19:52
liber87, если есть возможность редактировать HTML, установите у требуемого input идентификатор id...
Если бы я мог установить Id - все было бы просто)
Deff, если есть другие способы - буду признателен.
Deff, если есть другие способы - буду признателен.
Если есть jQuery - то -элементарно - хотя и на JS тоже не слишком сложно
Выложите минимально необходимый код HTML элементов
кнопка => http://s1.uploads.ru/i/vF07j.png
lord2kim
20.07.2012, 20:14
liber87, можно попробовать так, если используются простые текстовые поля
<html>
<head>
<title></title>
<script>
function a(event) {
var e = event || window.event;
e = e.target || e.srcElement;
var i=0;
var el = document.getElementsByTagName("input");
for (i=0; i < el.length; i++) {
if (el[i] == e) {
break;
}
}
el[i+1].value = document.getElementsByName("sel")[0].value + " " + document.getElementsByName("sel")[1].value + " " + document.getElementsByName("sel")[2].value;
}
</script>
</head>
<body>
<input type="text" name="asd">
<input type="text" name="asd">
<input type="text" name="asd">
<input type="text" name="asd">
<input type="text" name="asd">
<select name="sel"><option value="0">0</option><option value="1">1</option><option value="2">2</option><option value="3">3</option></select>
<select name="sel"><option value="0">0</option><option value="1">1</option><option value="2">2</option><option value="3">3</option></select>
<select name="sel"><option value="0">0</option><option value="1">1</option><option value="2">2</option><option value="3">3</option></select>
<input type="button" value="asdasd" onClick="a(event)">
<input type="text" name="asd"><input type="text" name="asd"><input type="text" name="asd"><input type="text" name="asd">
<input type="text" name="asd">
<input type="text" name="asd">
<input type="text" name="asd">
<input type="text" name="asd">
<input type="text" name="asd">
<input type="text" name="asd">
</body>
</html>
Deff наверняка решение получше придумает...
lord2kim, Вау, супер!!! То, что нужно! с меня магарыч!)
lord2kim
20.07.2012, 21:25
можно укоротить код, а также сделать возможность использования многострочных текстовых полей
<html>
<head>
<title></title>
<script>
function a(event) {
var e = event || window.event;
e = e.target || e.srcElement;
while (e) {
if (e.name == "asd") {
return e.value = document.getElementsByName("sel")[0].value + " " + document.getElementsByName("sel")[1].value + " " + document.getElementsByName("sel")[2].value;
}
else {
e = e.nextSibling;
}
}
}
</script>
</head>
<body>
<textarea name="asd"></textarea>
<textarea name="asd"></textarea>
<textarea name="asd"></textarea>
<textarea name="asd"></textarea>
<textarea name="asd"></textarea>
<select name="sel"><option value="0">0</option><option value="1">1</option><option value="2">2</option><option value="3">3</option></select>
<select name="sel"><option value="0">0</option><option value="1">1</option><option value="2">2</option><option value="3">3</option></select>
<select name="sel"><option value="0">0</option><option value="1">1</option><option value="2">2</option><option value="3">3</option></select>
<input type="button" value="asdasd" onClick="a(event)">
<textarea name="asdd"></textarea>
<textarea name="asdd"></textarea>
<textarea name="asdd"></textarea>
<textarea name="asdd"></textarea>
<textarea name="asd"></textarea>
<textarea name="asd"></textarea>
<textarea name="asd"></textarea>
<textarea name="asd"></textarea>
<textarea name="asd"></textarea>
<textarea name="asd"></textarea>
</body>
</html>
<div>
<select>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<select>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<select>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<input type="button" value="click" class="but">
<input>
</div>
<div>
<select>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<select>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<select>
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<input type="button" value="click" class="but">
<input>
</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.className == 'but') {
var sel = target.parentNode.getElementsByTagName('select');
var len = sel.length;
var inp = target.nextSibling.nextSibling;//target.nextElementSibling
inp.value = '';
for (var i = 0; i < len; i++) {
inp.value += sel[i].value + '; ';//inp.value += sel[i].options[sel[i].selectedIndex].text + '; ';
}
}
}//onclick end
}//onload end
</script>
vBulletin® v3.6.7, Copyright ©2000-2025, Jelsoft Enterprises Ltd. Перевод: zCarot