0

Quero pegar o texto que está dentro da tag <option>TEXTO</option>. A situação é a seguinte:

<select xmlns="http://www.w3.org/1999/xhtml" id="page1:form_section:form1:selectListCampus" name="page1:form_section:form1:selectListCampus" class="form-control" size="1" onchange="OnChange_Campus(this);"><option value="">Selecionar uma Opção</option><option value="a0PA0000007bDQ7MAM" selected="selected">Exemplo 1</option><option value="a0PA0000007bDQCMA2">Exemplo 2</option></select>

Já tentei document.getElementById('page1:form_section:form1:selectListCampus').innerText pra resgatar o texto "Exemplo 1", mas sem sucesso.

4
  • Mas você vai fazer o que com esse valor ? Commented 10/04/2018 às 20:21
  • Qual <option>? Estão aí três...
    – D. Pardal
    Commented 11/04/2018 às 10:21
  • Allan, quero guardá-lo em uma variável para guardar no cookie. Commented 11/04/2018 às 12:26
  • D. Pardal, preciso do "Exemplo 1" e "Exemplo 2" Commented 11/04/2018 às 12:27

5 Respostas 5

2

Tu que pegar o texto da opção selecionada, certo?

Se for isso tente assim:

function OnChange_Campus(selectObj){
    var txtOpcao = selectObj.options[selectObj.selectedIndex].text;
    alert(txtOpcao);
}
1

Penso que $("#page1:form_section:form1:selectListCampus").text(); te soluciona o problema. Assim é só ir buscar a opção seleccionada e em vez de te retornar a value, retorna-te o texto dentro da tag.

1

Para o elemento option selecionado, com JavaScript:

document.getElementById("id-do-elemento").value

Para um elemento específico da lista de options, com JavaScript:

document.getElementById("id-do-elemento").options[0].value

Para o elemento option selecionado, com Jquery:

$("#id-do-elemento option:selected").text()

Por valor do elemento option, com Jquery:

$("#id-do-elemento option[value='value-do-elemento']").text()
0

Você pode fazer isso de vária maneiras. Isso depende muito também do que você precisa implementar. Se for só pra armazenar os valores em uma variável o exemplo abaixo demonstra dois casos:

//Criando um id no elemento
var val = document.getElementById('option1').innerText;
console.log(val);
// Iterando a lista
var el = document.querySelector('.form-control');
var elements = [];
for (let n = 0; n < el.length; n++) {
   elements.push(el[n].innerText);            
}
console.log(elements);
<select xmlns="http://www.w3.org/1999/xhtml" id="page1:form_section:form1:selectListCampus" name="page1:form_section:form1:selectListCampus" class="form-control" size="1" onchange="OnChange_Campus(this);"><option value="">Selecionar uma Opção</option><option value="a0PA0000007bDQ7MAM" id="option1" selected="selected">Exemplo 1</option><option value="a0PA0000007bDQCMA2">Exemplo 2</option></select>

0

Utilize o exemplo que consta na API JQuery - Referência: JQUERY

$(function(){
$( "select" )
  .change(function() {
    var str = "";
    $( "select option:selected" ).each(function() {
      str += $( this ).text() + " ";
    });
    $( "div" ).text( str );
  })
  .trigger( "change" );
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select xmlns="http://www.w3.org/1999/xhtml" 
	id="page1:form_section:form1:selectListCampus" 
	name="page1:form_section:form1:selectListCampus" 
	class="form-control" size="1">
		<option value="" selected="selected">Selecionar uma Opção</option>
		<option value="a0PA0000007bDQ7MAM" >Exemplo 1</option>
		<option value="a0PA0000007bDQCMA2">Exemplo 2</option>
	</select>
	<div></div>

2
  • Importar JQuery só para isso? Acho desnecessário.
    – D. Pardal
    Commented 11/04/2018 às 10:24
  • @D. Pardal, coloque o teu código para ajudar e não comentários nada necessários Commented 12/04/2018 às 23:57

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .