Форум

sovsem-nub · #1 (**permalink**) 25.11.2015, 15:18

<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8">
</head><body>

<select class="oplataSelect">
<option value="oplNalKur">Наличными курьеру  </option>
<option value="moneta32863">Карта сбербанк   </option>
<option value="moneta1020">Яндекс деньги  </option>
<option value="moneta1017"> <a class="tc-tiddlylink tc-tiddlylink-missing" href="#WebMoney">WebMoney</a>  </option>
<option value="moneta31086">Киви кошелек  </option>
<option value="moneta32767">Пластиковая карта  VISA</option>
<option value="moneta36992">Пластиковая карта  <a class="tc-tiddlylink tc-tiddlylink-missing" href="#MasterCard">MasterCard</a></option>
<option value="all">выбрать  другой способ оплаты</option>
</select>

<script>
alert(document.querySelector('.oplataSelect').options[document.querySelector('.oplataSelect').options.selectedIndex].text)
</script>

</body>
</html>

очень мне не нравится конструкция (document.querySelector('.oplataSelect').options[document.querySelector('.oplataSelect').options.se lectedIndex].text)
чтобы показать текс. Может быть это можно как-то покороче написать?

Leon-on12 · #2 (**permalink**) 25.11.2015, 16:07

Так по моему не короче. Но для меня лично чуть более понятно.

<html>
<body>	
<select class="oplataSelect">

<option value="oplNalKur">Наличными курьеру  </option>
<option value="moneta32863">Карта сбербанк   </option>
<option value="moneta1020">Яндекс деньги  </option>
<option value="moneta1017"> <a class="tc-tiddlylink tc-tiddlylink-missing" href="#WebMoney">WebMoney</a>  </option>
<option value="moneta31086">Киви кошелек  </option>
<option value="moneta32767">Пластиковая карта  VISA</option>
<option value="moneta36992">Пластиковая карта  <a class="tc-tiddlylink tc-tiddlylink-missing" href="#MasterCard">MasterCard</a></option>
<option value="all">выбрать  другой способ оплаты</option>

</select>
</body>
</html>

var sel = document.getElementsByTagName("select");
var opt = document.getElementsByTagName("option");
sel[0].oninput = funcAlert;
function funcAlert(){
	alert(sel[0].value);
	for (var i=0;i<opt.length;i++){
		if (opt[i].value == sel[0].value) alert(opt[i].innerHTML)
	}
}

ruslan_mart · #3 (**permalink**) 25.11.2015, 18:15

document.querySelector('.oplataSelect').selectedOptions[0].text;

sovsem-nub · #4 (**permalink**) 26.11.2015, 11:11

нет. селектов разных на странице 3 штуки отличаются только классом.
getElementsByTagName не подойдет

selectedOptions[0].text тоже не подойдет, потому что нужно будет получать text не первого, а того, что выбран.

если честно, я очень удивлён, что текст можно получить только по индексу. Неужели нельзя его получить по его .value значению?

рони · #5 (**permalink**) 26.11.2015, 11:27

sovsem-nub,

<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8">
</head><body>

<select class="oplataSelect">
<option value="oplNalKur">Наличными курьеру  </option>
<option value="moneta32863">Карта сбербанк   </option>
<option value="moneta1020">Яндекс деньги  </option>
<option value="moneta1017"> <a class="tc-tiddlylink tc-tiddlylink-missing" href="#WebMoney">WebMoney</a>  </option>
<option value="moneta31086">Киви кошелек  </option>
<option value="moneta32767" selected="selected">Пластиковая карта  VISA</option>
<option value="moneta36992">Пластиковая карта  <a class="tc-tiddlylink tc-tiddlylink-missing" href="#MasterCard">MasterCard</a></option>
<option value="all">выбрать  другой способ оплаты</option>
</select>

<script>
var sel = document.querySelector('.oplataSelect');
alert(sel.querySelector('[value="'+sel.value+'"]').text)
</script>

</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript