Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Массив кнопок, узнать индекс нажатой кнопки (https://javascript.ru/forum/dom-window/32918-massiv-knopok-uznat-indeks-nazhatojj-knopki.html)

DarkDaemon 04.11.2012 06:27

Массив кнопок, узнать индекс нажатой кнопки
 
Имеется массив кнопок button[]. Как узнать индекс нажатой кнопки? Два часа рылся в интернете, а так же на этом форуме, ответ не нашел. Я решил задачу, но считаю, что должно быть решение проще:

<script>
function ins(e){
	var o = document.getElementsByName('butt[]');
	for (i=0;i<o.length;i++){
		if (o(i) == e) alert ('Индекс ' + i);
	}
}
</script>
<input type='button' name='butt[]' value='ok1' onclick='ins(this)'/>
<input type='button' name='butt[]' value='ok2' onclick='ins(this)'/>
<input type='button' name='butt[]' value='ok3' onclick='ins(this)'/>
<input type='button' name='butt[]' value='ok4' onclick='ins(this)'/>
<input type='button' name='butt[]' value='ok5' onclick='ins(this)'/>
<input type='button' name='butt[]' value='ok6' onclick='ins(this)'/>

vadim5june 04.11.2012 08:50

function ins(t){
alert(t.value.substring(2,3));	
}

bes 04.11.2012 10:48

на чистом js без цикла вроде никак, не прибегая к ручному заданию номеров и их извлечению (например, как показал vadim5june)

Цитата:

Сообщение от DarkDaemon
(o(i)

o[i]
добавить return, o.length - в отдельную переменную (хотя и Фленаган и Илья Кантор почему-то этого не делают, хотя по идее это выражение вычисляется каждый раз
http://es5.javascript.ru/x12.html#x12.6.3
Цитата:

Повторить
Если присутствует первое Expression, то
Пусть testExprRef будет результатом вычисления первого Expression.
)
видимо из-за того, что машины стали слишком производительными :)
PS: атрибут onclick уже давно признак плохого стиля, не

DarkDaemon 04.11.2012 13:31

Цитата:

Сообщение от vadim5june (Сообщение 213970)
function ins(t){
alert(t.value.substring(2,3));	
}

А если кнопки называются одинаково? Такое решение не подойдет ;)

Цитата:

Сообщение от bes (Сообщение 213974)
PS: атрибут onclick уже давно признак плохого стиля

А что лучше использовать?

Спасибо за детальные замечания, поправил код:
function ins(e){
	var o = document.getElementsByName('butt[]');
	var l = o.length;
	for (i=0; i<l; i++){
		if (o[i] == e) {var ind = i; break;}
	}
	alert ('Индекс ' + ind);
}

vadim5june 04.11.2012 13:40

Цитата:

Сообщение от DarkDaemon
А если кнопки называются одинаково? Такое решение не подойдет

если одинаково название то и в Вашем случае будет ошибка когда нажмете вторую из одинаковых

bes 04.11.2012 13:57

что-нибудь типа такого
<form id="form">
	<input type='button' name='butt[]' value='ok1'/>
	<input type='button' name='butt[]' value='ok2'/>
	<input type='button' name='butt[]' value='ok3'/>
	<input type='button' name='butt[]' value='ok4'/>
<form>

<script>
window.onload = function () {
	function index(element, collection) {
		var len = collection.length;
		for (var i = 0; i < len; i++) {
			if (element == collection[i]) {
				return i;
			}
		}
	}
	document.getElementById('form').onclick = function (e) {
		var e = e || event;
		var target = e.target || e.srcElement;
		if (target.type == 'button') {
			alert(index(target, document.getElementsByName('butt[]')));
		}
	}

}
</script>


Цитата:

Сообщение от DarkDaemon
А что лучше использовать?

свойство onclick, назначать через addEventListener/attachEvent (в отличие от свойства onclick назначенные действия не затрут предыдущие назначенные)
см. ненавязчивый javascript

DarkDaemon 04.11.2012 15:20

Цитата:

Сообщение от bes (Сообщение 214025)
что-нибудь типа такого
свойство onclick, назначать через addEventListener/attachEvent (в отличие от свойства onclick назначенные действия не затрут предыдущие назначенные)
см. ненавязчивый javascript

Да, более изящное решение :) Спасибо!

DarkDaemon 04.11.2012 15:23

Цитата:

Сообщение от vadim5june (Сообщение 214021)
если одинаково название то и в Вашем случае будет ошибка когда нажмете вторую из одинаковых

Никакой ошибки нет ;)

<script>
function ins(e){
    var o = document.getElementsByName('butt[]');
    var l = o.length;
    for (i=0; i<l; i++){
        if (o[i] == e) {var ind = i; break;}
    }
    alert ('Индекс ' + ind);
}
</script>
<input type='button' name='butt[]' value='ok' onclick='ins(this)'/>
<input type='button' name='butt[]' value='ok' onclick='ins(this)'/>
<input type='button' name='butt[]' value='ok' onclick='ins(this)'/>
<input type='button' name='butt[]' value='ok' onclick='ins(this)'/>
<input type='button' name='butt[]' value='ok' onclick='ins(this)'/>
<input type='button' name='butt[]' value='ok' onclick='ins(this)'/>

bes 04.11.2012 15:29

Цитата:

Сообщение от DarkDaemon
ror (i=0; i&lt;l; i++)

перестал использовать l, так как здесь на форуме некорректно отображается:)

vadim5june 04.11.2012 15:36

Цитата:

Сообщение от DarkDaemon
Никакой ошибки нет

Да нормально работает-это я ошибся


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