Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Помогите с соседним элементом (https://javascript.ru/forum/dom-window/30013-pomogite-s-sosednim-ehlementom.html)

liber87 20.07.2012 19:43

Помогите с соседним элементом
 
День добрый!
Есть поле инпут типа текст. Перед ним идет три селекта с кнопкой в конце. Необходимо, чтобы по нажатию на кнопку в этот самый инпут вписывались значения, взятые из селектов.
задача осложняется тем, что таких инпутов, куда нужно вставлять, может быть несметное множество и с одинаковым именем...((
Вопрос: как яве объяснить, что нужно вставлять именно в тот инпут, который идет за кнопкой?

Deff 20.07.2012 19:47

liber87,
Пользуемся Только ява-скрипт ?

lord2kim 20.07.2012 19:52

liber87, если есть возможность редактировать HTML, установите у требуемого input идентификатор id...

liber87 20.07.2012 20:10

Если бы я мог установить Id - все было бы просто)
Deff, если есть другие способы - буду признателен.

Deff 20.07.2012 20:11

Цитата:

Сообщение от liber87
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 наверняка решение получше придумает...

liber87 20.07.2012 20:29

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>

bes 20.07.2012 23:18

<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>


Часовой пояс GMT +3, время: 23:14.