how to get selected option text in javascript

refs

others

https://developer.mozilla.org/en-US/docs/Web/API/HTMLSelectElement/item

question

solution

// e.target

temp1.options[temp1.selectedIndex].text;

// "五楼"

temp1.selectedOptions[0].text;

// "五楼"

OK

There are two solutions, as far as I know.

both that just need using vanilla javascript

1 selectedOptions

<div class="select-box clearfix">

  <label for="area">Area</label>

  <select id="area">

    <option value="101">A1</option>

    <option value="102">B2</option>

    <option value="103">C3</option>

  </select>

</div>

const log = console.log;

const areaSelect = document.querySelector(`[id="area"]`);

areaSelect.addEventListener(`change`, (e) => {

  // log(`e.target`, e.target);

  const select = e.target;

  const value = select.value;

  const desc = select.selectedOptions[0].text;

  log(`option desc`, desc);

});

2 options

<div class="select-box clearfix">

  <label for="area">Area</label>

  <select id="area">

    <option value="101">A1</option>

    <option value="102">B2</option>

    <option value="103">C3</option>

  </select>

</div>

const log = console.log;

const areaSelect = document.querySelector(`[id="area"]`);

areaSelect.addEventListener(`change`, (e) => {

  // log(`e.target`, e.target);

  const select = e.target;

  const value = select.value;

  const desc = select.options[select.selectedIndex].text;

  log(`option desc`, desc);

});

巴特西

how to get selected option text in javascript

how to get selected option text in javascript

refs

question

solution

OK

There are two solutions, as far as I know.

1 selectedOptions

2 options

最新文章

热门文章